Templates for webviewing available?

Questions
1

Hi all, I’m new here and 99% noob to Babylon. I’ve played a little with the sandbox and playground and a little with the desktop app. Here’s my challenge:

I create .GLB and .OBJ content in Photoshop and Sketchup, upload it to my domain in order to share it with others through a simple URL. I think the Babylon Viewer would be great to enable that. So what I need is a an HTML-index file (to share) with Babylon js code that I can use over and over by only changing the url of my .GLB file.

My question: are there templates available that I can use for that?

It’s probably very simple code to produce, but it’s not working for me.

Thanks!

2

Hello and Welcome !!!

I guess you can find all of them here: The Babylon.js Viewer - Babylon.js Documentation

1 Like
3

Thanks. When I tried and replaced the example boombox model with my own model it gave me an “error loading the model”.
Should the viewer and the model be in the same directory?

4

Not necessarily as you are passing the full path for it. But it looks like your model is not accessible ? Could you share your example ?

5

Thanks, I appreciate it. This is the url of the model: https://3d360.icu/3D/AERIALS/EagleView1/EagleView1.glb

6

Is is currently blocked due to the cors issue :

image
image1653×172 43.3 KB

Basically your model looks like it is hosted on a domain not allowing cross origin requests.

7

Ouch… let me find out what that means and if I can fix it. Thanks!

8

Do you think it would solve the problem if I’d upload the viewer to the same domain as the model?

9

the page should be on the same domain this is the main restriction :slight_smile:

11

same domain, console doesn’t mention cors anymore, still unable to load mesh.

Babylon.js Viewer - Display a 3D model

Screen Shot 2020-05-26 at 3.28.35 PM
Screen Shot 2020-05-26 at 3.28.35 PM2174×318 137 KB

12

Can you share the url of the website ?

13

Not really a website, just a url that I need to share on an individual basis.

Link

14

But the url you use for the model in this page does not exist: https://3d360.icu/3D/AERIALS/EAGLEVIEW1/EagleView1.glb returns 404.

The path might be case sensitive on your server, you should use:
https://3d360.icu/3D/AERIALS/EagleView1/EagleView1.glb

1 Like
15

restructured case sensitivity. I uploaded the boombox example to my domain, same error.
It may be my domain settings. I’ll contact my provider. Thank you so much. Highly appreciated.
Link

1 Like
16

I had to add
AddType application/babylon .babylon
to my .htaccess to get the .babylon files loaded into my website without errors. Maybe you try to add
AddType model/gltf-binary .glb
or
AddType model/gltf-bin .glb
in your .htaccess file?

1 Like
17

Thanks, I’ll try that.

18

No luck, so far …

19

@August
At this page, I dont use the viewer, but load the .babylon scene that was exported from blender 2.8:
https://virtueller-messestand.de/fileadmin/3dcontent/3/
In this page, I use the viewer to display a .glb file that was exported from blender:
https://virtueller-messestand.de/fileadmin/3dcontent/lampe/

Please dont rely on the pages cause I am new to babylon, too, and still learn how to do things, so there might be bugs and stupidness in my solution. And the pages might change soon… Anyway, take a peek and let me know how it works for you.

20

Thanks! It’s working. I copied and pasted your code on to my domain and it worked. Then I replaced the parts with my own code and it kept working! Happy as a clam!
Now I need to optimize my glb models… :wink:
link
Thanks bud, highly appreciated