JavaScript Embed API
Open standards & APIsControl embedded Vuframe® 3D models and Smartvus from your own page with JavaScript: hotspots, textures, objects and more.
The JavaScript Embed API lets your web page talk to an embedded Vuframe® viewer. You send commands with the browser's standard postMessage interface: activate hotspots, change textures, show or hide objects, pause the viewer. You do not need a library; use it to build your own configurator or a 3D background with your own UI.
Control the viewer with JavaScript
- Embed your 3D model or SmartVu® with an iframe and give the iframe an
id. - Get the window of the iframe:
const vf = document.getElementById('vuframe').contentWindow;. - Send a command, for example
vf.postMessage({ method: 'vf.activate_trigger', id: 'door' }, 'https://embed.vuframe.com');. - See the full list of methods (
vf.activate_trigger,vf.set_texture,vf.show_object,vf.hide_object,vf.pause,vf.unpause,vf.ui.list_triggers…) in the Embed API reference.
Good to know: The API works with every framework (React, Vue, plain HTML). Working examples are on GitHub: 3D background and configurator. See also Embed with custom HTML.