<?xml encoding=”UTF-8″>By Adam Nagy
Configurator 360 enables you to upload your design and then let others configure it through a web or mobile interface. Now you can even embed the web component in your own webpage. To test this feature you’ll need at least a trial account, which you can get through here: http://www.autodesk.com/products/autodesk-configurator-360/free-trial
And here you can find the information on embedding the web component which also includes a link to a sample page: http://embedding.configurator360.autodesk.com/doc.html
One thing to note is that the URL of the webpage embedding the configurator needs to be exact – e.g. simply adding http://www.typepad.com is not enough. When I was writing this article and wanted to preview it, the temporary URL was different from the final URL of the blog post and so I needed to add that too:
I also needed to set Unrestricted viewing access for the model so that anyone looking at this webpage can access it:
Configurator 360 web component is using WebGL and so can be used on any WebGL enabled device. If the web control does not appear below then it is not supported on your system.
https://configurator360.autodesk.com/Script/EmbeddedViewer
(function (window) {
“use strict”;
var C360 = window.ADSK && window.ADSK.C360;
// callback for getPropertyValues.
function listProperties(result) {
window.console.log(window.JSON.stringify(result, null, ” “));
}
// success handler
function viewerLoaded(viewer) {
// The C360Viewer is loaded, do something with it.
viewer.getPropertyValues(null, listProperties);
}
// error handler
function failedToLoad(viewer) {
window.alert(“The viewer failed to load for some reason.”);
viewer.unload(); // Unload the C360Viewer
}
// Check if the API was loaded.
if (C360 && !C360.isLoaded) { // Not supported on mobile devices currently.
C360.isLoaded = true;
// Initialize the viewer
C360.initViewer({
container: “myViewer”,
design: “520905552843171165/rlmjpx00pvv7”,
panes: { // Panes to show
parameters: true
},
success: viewerLoaded, // Set success handler
error: failedToLoad // Set error handler
});
}
}(this));
For some reason on typepad the content gets inserted twice (one of which is hidden) which means the script is inserted and run twice too, creating two controls one under the other. To avoid that I modified the code to store in the C360.isLoaded variable if the component is loaded already, and if not, only then run the usual code:
// Check if the API was loaded.
if (C360 && !C360.isLoaded) {
C360.isLoaded = true;
// Initialize the viewer
C360.initViewer({
container: "myViewer",
design: "520905552843171165/rlmjpx00pvv7",
panes: { // Panes to show
parameters: true
},
success: viewerLoaded, // Set success handler
error: failedToLoad // Set error handler
});
}If you want to keep up-to-date with the latest features of Configurator 360 then keep an eye on this forum post: http://forums.autodesk.com/t5/Configurator-360-General/What-s-New-in-Configurator-360/m-p/4378949
Leave a Reply