Show glb file on web page

I am having problems showing a glb file on a web page. Hoping someone can give me advice how to accomplish it. I looked at some tutorials about how to use model-viewer but my page comes up blank.

I finally got my file to show up but I cannot rotate, pan or zoom it. When I look at the page describing the model viewer and drag my file to their web site it works fine. There is then a link to download the file(s). I try running the code on my laptop and that is when I have the problem

It looks like the glb file format coul be a good asset for showing something like products on a web page in a 3D/AR format.

Again hope someone might be able to provide me some feedback on how to do something like this. I think it would be neat to be able to present a simple way to view a SketchUp model in an interactive format on a web page.

I think that I have now discovered that for this to work you need a web server with three.js installed. I do not think I can do it on my laptop and I do not have access to a web server anywhere. Just to share what I am thinking. I have added an image of a possible web page that shows what is in the back of my mind. :smile:

Here is an updated version of what I am envisioning:

In the image, you will see the “home/host” web page for the models to be shared with the viewer. That web page has a

and an iFrame . The
on the left is a scrollable list of the models the host wants to present/make available to site viewers (kind of like an ecommerce site or a vendor who is showing parts available to site viewers. The iFrame to the left would be empty when the visitor initially comes to the web page. When the visitor clicks on a model in the scrollable list, a web page for that product/model will then be loaded in the iFrame to the left.

Now the crucial part: each model/product in the clickable list on the left will have a dedicated web page that contains two key elements. First there is a

where the 3D viewable glb file for the selected part/model will be presented much like the astronaut on this page Model-Viewer Sample Secondly, there will be a scrollable
below the 3D model that will present the information/details about the model/product the provider wants to share with the site viewer. So when the user clicks on the model in the scrollable list on the left, the appropriate web page will be loaded in the iFrame to make the appropriate information/model available to the visitor.

I hope this makes sense and helps clarify what I was trying to suggest.

SketchUp now has an embedded function to create glb files that there is also a need for a way to present those files on an organized web page environment.