User posts jaspixel
13 March 2020 14:50
[ON MODERATION]
Hi,
I hope someone can help please, as I am puling my hair out trying to decide the best route/ solution for the following problem.
I have 20 camera moves all set up within my blend4web scene, using targets and click nodes for each camera move. I also used 20 different empties parented to the camera to use as a menu and when clicked, they all move the camera to each corresponding part of the model fine.
However, this menu method does not work on tablets and mobiles, because all the empties get bunched up and unselectable. I need to figure out a way to have an html menu that scales accordingly to the device the viewer is viewing on and simply scrolls through the 20 menu options one by one using arrows either side of the menu name as each one appears (i.e always in the same single place instead of 20 different menu buttons, just one that scrolls through the selection).
I was wondering if I should parent one empty/anchor to the camera at the bottom middle of the screen and somehow define an html menu assigned to the empty. This html menu could then scroll through the menu options one by one, allowing each click of each individual menu option to go to each individual camera position.
So basically If I use an empty/anchor that allows the scrolling left and right html menu choice to then select the correct camera move per item. Is this the best way to do it?
But how do I get the html menu to select each new camera move with each new menu option via the same single empty in the blend4web scene please?
Screen grab concept here:
http://www.pixelperfect.co.uk/Misc/screen-grab-annotations.jpg
I hope that makes sense![]( "smiling")
Thanks for any help.
Jas
I hope someone can help please, as I am puling my hair out trying to decide the best route/ solution for the following problem.
I have 20 camera moves all set up within my blend4web scene, using targets and click nodes for each camera move. I also used 20 different empties parented to the camera to use as a menu and when clicked, they all move the camera to each corresponding part of the model fine.
However, this menu method does not work on tablets and mobiles, because all the empties get bunched up and unselectable. I need to figure out a way to have an html menu that scales accordingly to the device the viewer is viewing on and simply scrolls through the 20 menu options one by one using arrows either side of the menu name as each one appears (i.e always in the same single place instead of 20 different menu buttons, just one that scrolls through the selection).
I was wondering if I should parent one empty/anchor to the camera at the bottom middle of the screen and somehow define an html menu assigned to the empty. This html menu could then scroll through the menu options one by one, allowing each click of each individual menu option to go to each individual camera position.
So basically If I use an empty/anchor that allows the scrolling left and right html menu choice to then select the correct camera move per item. Is this the best way to do it?
But how do I get the html menu to select each new camera move with each new menu option via the same single empty in the blend4web scene please?
Screen grab concept here:
http://www.pixelperfect.co.uk/Misc/screen-grab-annotations.jpg
I hope that makes sense
Thanks for any help.
Jas
25 February 2020 13:28
Hi,
I'm loving playing with Blend4Web.
If anyone can point me in the right direction for my currently problem I would be very grateful.
If you look at this demo I created, you will see a menu on the left which when clicked makes the camera move to each box in the 3d scene. However this menu fails when viewed on mobiles and tablets because it shrinks and becomes impossible to view.
http://www.pixelperfect.co.uk/Misc/blend4webmenu/menu-test-01.html
What I would like to achieve is a menu at the bottom, just like the SketchFab annotations menu, where each menu item is displayed between two arrows either side. Then with each click of the arrows, the menu name changes as it cycles through the list and the camera moves to each relevant box as each menu name appears.
If there is a tutorial or guide somewhere I would be very grateful.
Many thanks,
Jas
I'm loving playing with Blend4Web.
If anyone can point me in the right direction for my currently problem I would be very grateful.
If you look at this demo I created, you will see a menu on the left which when clicked makes the camera move to each box in the 3d scene. However this menu fails when viewed on mobiles and tablets because it shrinks and becomes impossible to view.
http://www.pixelperfect.co.uk/Misc/blend4webmenu/menu-test-01.html
What I would like to achieve is a menu at the bottom, just like the SketchFab annotations menu, where each menu item is displayed between two arrows either side. Then with each click of the arrows, the menu name changes as it cycles through the list and the camera moves to each relevant box as each menu name appears.
If there is a tutorial or guide somewhere I would be very grateful.
Many thanks,
Jas
13 February 2020 15:56
Hi,
I seem to be missing something when trying the expert mode.
I downloaded your sample project files and tried running the custom_anchor.html expecting to see your box with the anchor text links. This did not happen and I just got a black screen in my browser.
In the tutorial you say to enter the body text under the canvas div. Do you mean I should export the blender project as the complete blend4web html file and add your html code suggestions to this main file? Or is this to be a separate html file specifically for the annotations?
I seem to be missing how this all links with the CSS and java files too.
I'm running Blender 2.79
Thanks for your help.
Jas
***NB***
I figured it out. I was trying to set this all up manually, but figured it out using the project manager within Blender. I created the project name with the default settings and could edit the html, css and java from the project manager panel (project manager editor in the browser window not within Blender)
The main tip I worked out the hard way, was making sure your save the blender project file and json file with the same name as the project name and in the right directory within the blender project folders.
All running fine now, looks great.
I seem to be missing something when trying the expert mode.
I downloaded your sample project files and tried running the custom_anchor.html expecting to see your box with the anchor text links. This did not happen and I just got a black screen in my browser.
In the tutorial you say to enter the body text under the canvas div. Do you mean I should export the blender project as the complete blend4web html file and add your html code suggestions to this main file? Or is this to be a separate html file specifically for the annotations?
I seem to be missing how this all links with the CSS and java files too.
I'm running Blender 2.79
Thanks for your help.
Jas
***NB***
I figured it out. I was trying to set this all up manually, but figured it out using the project manager within Blender. I created the project name with the default settings and could edit the html, css and java from the project manager panel (project manager editor in the browser window not within Blender)
The main tip I worked out the hard way, was making sure your save the blender project file and json file with the same name as the project name and in the right directory within the blender project folders.
All running fine now, looks great.