Hello,
It seems that for your case, to avoid the tags reconfiguration, the simplest way is just to add small .js for all viewer website pages (as it described here - Babylon.js Viewer - Advanced usage | Babylon.js Documentation).
Let me know if it suits you; as far as I remember I have this script somewhere but need some time to find it
Basically it is just several lines, but you need to put them into the right place.
var hdrTexture = new BABYLON.CubeTexture.CreateFromPrefilteredData("https://playground.babylonjs.com/textures/environment.env", viewer.sceneManager.scene);
viewer.sceneManager.scene.environmentTexture = hdrTexture;
Well, this is just the part of some bigger script - BabylonJS Viewer Progress Bar with Overlay Image
Wait a bit, while Iâll get access to my laptop (in 5-6 hrs), Iâll write more exactly what you need to do to use it with Wordpress.
So here is the basic HTML setup - BabylonJS Viewer with Promises and Changed ENV Texture
There are also commented lines which allow to change clearColor parameter, logo etc. You can change actually any scene/camera/lights/meshes and rendering pipeline settings as in usual Babylon.js script.
Using the Babylon Viewer 3D WordPress plugin as in abovementioned example you may need to edit this line in babylon-shortcode.php and set the last attribute to false (to put the Babylon Viewer script into the header instead of footer):
Oh thank you, youâre really great thatâs working . i had to
-add enqueue_script
-add new html < babylon id=âbabylon-viewerâ> elements
-change the babylon-shortcode.php to false for the enqueue_script(âbabylon-viewerââŚ
Great itâs more fun now really nice.
After, in my webpage i have 2 canvas viewers and i had to give 2 differents id and redo 2 times those scripts for associate each id script getViewerById(âbabylon-viewer-1â) for each tag babylon with associated id . Maybe thereâs be another way to do it easier without ids?
For now , thatâs ok i would thank you very much ! (maybe soon iâll come back)
maybe a last thing : in all browers the e.preventDefault on the event âscroll DOMMouseScroll wheelâ {passive:false} argument working for firefox, for chrome on iMac, for Safari, but not on chrome on windows 10. i really donât know whatâs going on with âŚ
If you want to test my website : https://3d.jupixel.fr for seing a part of my 3d work
Nice models!
You may add more 3D experience with some scripting (change textures or walk around etc).
As for e.preventDefault - not sure how you implemented it. Let me know if it works for you in Chrome for WIndows 10 (it works for me) at this testing page - Testing BabylonPress 3D Suite â BabylonPress
I use canvas.addEventListener("wheel", evt => evt.preventDefault());
Finally, Iâve tried everything with javascript selectors , nothing.
I have in my theme i think some jQuery implicated with wheel mousewheel scroll and the solution for me was :
Thank you anyway but for my part it was this one :
Be carefull when using a < babylon ></ babylon > inside a page in editor mode, code < babylon >< / babylon > may disappearing when saving page⌠(thatâs what happened to me just now, thinking cdn was KO, because code wasnât modified and canvas disappeared )
If you use Wordpress visual editor it may perform unnecessary cleaning of your code, so better use HTML mode or, if Gutenberg editor, standard HTML blocks.
Yes , thank you itâs fine. Just some subtilities ^^, youâre great.
Iâd really want to do more with that plugin,
Iâm trying to understand for example how to set up lights :
lights are inside < lights > < / lights > tags.
Attributes of light 1 is for example type=1, < light1 type=â1â shadow-enabled=âtrueâ > after testing seems meaning a directional light, well .
How could i set up some other lights with tags? any documentation if i want to make a spot light, which is the corresponding type? where could i find the API for setting it well.Idem for cameras,
Another thing : engine.antialiasing=âtrueâ seems not reducing aliasing. lights are still aliased for type=â1â for example.
I use this script with Babylon Viewer. But you can also put any babylon.js script into Wordpress (with some conditions, for example you may need unique canvas ID).
Hello @labris,
i tried this method and im getting 2 viewers,
-add enqueue_script
-add new html < babylon id=âbabylon-viewerâ> elements
-change the babylon-shortcode.php to false for the enqueue_script(âbabylon-viewerââŚ