Rudimentary API to interact with 3D Warehouse Viewer

I apologize for asking this question again, but now that you are improving the version of the 3D Warehourse Viewer, would it be possible to add some simple event handling so that we can programatically cycle through the scenes of models embedded in our web site. I believe this code would take less than an hour to implement, have no security consequences, and be incredibly useful to those of us embedding models for demonstrations (I’m using mine on an urban planning advocacy web site).

From my hosting page I’d like to be able to request the embedded model’s default view, next/previous scene, and scene of a certain index or name:

const iframe = … the iframe of the embedded viewer …
iframe.postMessage('gotoScene, index_or_name)

The 3d Warehouse Viewer handler code would be something like

window.addEventListener(‘gotoNextScene’,function(event) {
// Use 3d warehouse viewer functions to change scene


1 Like

Hi Andy,

We haven’t formally launched an API for the 3D Warehouse viewer, but when we do so I’m sure that features like the ones you are requesting would be widely relevant to many folks. As I’m sure you appreciate, the work of implementing the new interface is dwarfed many times over in the maintenance of those interfaces over time— APIs have very long lives :wink:

Would you be willing to talk a bit more about the way you’d like to be able to use this on your site? What feature/service are you hoping to be able to build?


Hi John, as somebody who’s written APIs in the past, I feel your pain and the scope of your work. Although a full-scale API is incredibly important, all I need right now for my app is exposure of the existing client-side viewer functionality that is simply blocked because of iframe cross-domain security. I don’t have any need to request additional data from the server, edit the model itself, etc. I’m sure you’re thinking about all those things in your API.

I have a site that embeds serveral of my Sketchup models with the 3D Viewer. As the user scrolls the text, the corresponding model loads that matches the current text. I also want the text scrolling to trigger scene changes within each model. Even though it’s trivial for the user to open the scene menu and change it, I’m blocked from doing programmatically by browser security. So the two solutions I know of would be 1) Expose a handful of client-side event handlers or 2) Grant users cross-domain resource sharing (CORS). 1 Seems much simpler than 2 at this point and doesn’t require a formal API, just some docs that mention you can change the scene of a loaded model using javascript.

Thanks, and let me know if I can help in any other way. I’m delighted by the work you’re doing.

Have you noticed any problems with memory allocation in your application? Each of the models you’re loading are going to grab a significant chunk of memory, just wondering if that is OK from your perspective?

Hi John,

Yes I have. I’m hitting several gigs of memory consumption when I have a lot of the models loaded. What I’m experimenting with now is replacing the models with HTML5 videos that play Sketchup animations of the model. This allows me to control scene changes by playing a certain portion of the video as the user scrolls the document text. I then offer the user the option to load a 3D model by clicking a button next to the video. It’s not an idea solution, but it performs much better.

I think the ideal flow for me would be to create just one iframe with the plugin and then be able to load subsequent models in that iframe without reloading all of the supporting three.js and other files (in other words call your API to switch out the model). You might already have this capability on the editor. I really don’t need to have more than three 3D models loaded at a time (a current, previous, and next) as long as I can load new ones fairly quickly.

Let me know if that answers your question, and thanks,