i am trying to integrate a shapediver model over an iframe into a django web-app.
I’ve got a Pro account of shapediver and i used the embedding code out of my model and i uncommented the line for api access as written in the documentation.
The SDVReflector object gets defined as soon as the first message is received from the iframe. It’s important that the id of the iframe is sdv-iframe or sdv-frame, others are ignored.
You might be running into a timing problem. Please try to move the script tag for the sdv_reflector.min.js to a place before the iframe.
Doesn’t seem like a problem, your call to api=SDVReflector.get('api') seems to have succeeded as expected. This gives you the api object to use for controlling the viewer. As an example, you can go ahead now and change parameters, control the camera, etc
An example to start with:
Perhaps i have to explain a little bit my approach.
I want to optimize parameters of a design and i have a algorithm (PSO) which edits parameters of multiple designs based on user-ratings. This works quite well with 2D-Designs and now i want to find out if i can edit 3D-Design with this approach powered with shapediver.
The algorithm is enbedded in a django webapp. So the parameter value is transfered to the html which seems to work. But the communication with the shapediver iframe doesn’t work at the moment.
I am very happy about help in this quite special case!
Thanks for the link. As it turns out, there is a bug in the platform: the URL inside the iframe should start with https:, otherwise the origin check fails and the API object can’t be loaded.
It should look like this: <iframe id="sdv-iframe" src="https://viewer.shapediver.com/v2/2.7.0/iframe/remote.html...
I tested it in your page and it solved the problem.
However there is still an error in the link you sent, because then your are making a call to update a parameter value using an value that is not valid (setting 184 to a parameter that accepts values between 5 and 20). If you try to set a correct value, it works as expected.
The bug will be fixed very soon on the platform, in the meantime don’t forget to do this small change manually. As a side note, we had missed this until now because most users use direct embedding, which is more flexible and provides more features. Is there any reason you prefer using the iframe? Otherwise consider using direct embedding, which is better documented at the moment.
Ah! Yeah now it works properly!
Thank you so much…
i started to use the iframe version, because i thought that i only had the license with PRO for this version. But probably this is a stupid misunderstanding on my part.
But it would also be interesting for me to understand the differences. Which version is better in terms of loading time? I don’t need complex interfaces at the moment, because currently only the algorithm changes parameters.
The iframe version makes it easier to load the viewers with all the GUI elements. It is also the only way at the moment to embed several models on the same page. However, some of the advanced API functionality is not available through the iframe. Reading and updating parameters works fine though.
Direct embedding might be slightly faster, especially if you don’t need any of the UI, then you can load the 3d view only. The API is fully available for directly embedded models, and some of its functions are more convenient (synchronous responses).
If you want to try it, switching to direct embedding shouldn’t be too much work for your application. Find everything you need in the documentation.
First of all, an update on embedding several viewers: it is actually an issue we are working on at the moment. It will be possible both for iframe and direct embedding in the near future. For now, it is possible to embed two viewers in iframes, but the API will not work properly. After the next update, multiple viewers and their respective APIs will be available in all cases.
As for controlling both viewers at the same time, there is no straightforward way to do this. Below is an idea of how you could do this (once the above issue is fixed!).
I guess you could set a listener on the viewer containers for mouse move events (while mouse down), get the camera of the active viewer using the API (api.scene.camera.get()) and then set the camera in the other one (api.scene.camera.updateAsync()). Of course, since you have two viewers, there is a different api interface object for each of them, so it would look like this:
thank you very much!
For me this would be really essential.
Is there a time frame when this could be realized? At the moment i want to buy a years license.
This functionality would be really important because i want to compare diferent models. So will it be possible to use this in some months or are we talking about a longer timeframe?