Home › Forums › General Questions › Save Configurator
- This topic has 1 reply, 2 voices, and was last updated 6 years, 7 months ago by Ivan Lyubovnikov.
-
AuthorPosts
-
2018-04-23 at 8:21 pm #3886rezmanCustomer
I’m looking to build a product configurator, but I’d like to give the user the ability to either save a page link with the selected options, or possibly a screenshot of the page. Any ideas on how I could accomplish this?
Thanks!
2018-04-24 at 10:16 am #3897Ivan LyubovnikovStaffHi, you can use GET-parameters of an URL to store the selected options.
In general, this task splits into 2 parts:
1) If you know what product/model is in the scene, you can generate an URL which should look something like this:
https://my.configurator.com?model=table&color=black&size=medium
and show it to a user, either via code or via HTML puzzles.2) Also, you need to parse these parameters when a user opens the link, for example by using the AppUtils.getPageParams method:
var params = v3d.AppUtils.getPageParams(); if (params.model == 'table') { // show the model } if (params.color == 'black') { // set model parameters } if (params.size == 'medium') { // set model parameters }
– there are no puzzles for this currently, only by coding.
I think we’ll add some demo in the SDK to show how to do that without coding by the next release.
Regarding the question about the screenshot: it’s also doable with coding. If you create a default application in the Verge3D App Manager and then open the main .js file you can replace these lines:
var app = new V3DPlayer('container', null, new v3d.SimplePreloader({ container: 'container' }));
with the following ones:
var app = new V3DPlayer('container', { preserveDrawingBuffer: true }, new v3d.SimplePreloader({ container: 'container' }));
Also you can add this code into the runCode function:
var b = document.createElement('button'); b.innerHTML = 'screenshot'; b.style = 'position: relative; z-index:999'; document.body.appendChild(b); var a = document.createElement('a'); a.download = 'screenshot.png'; document.body.appendChild(a); b.onclick = function() { a.href = app.renderer.domElement.toDataURL("image/png"); a.click(); }
– it creates a button, which makes a screenshot of the current scene and downloads it.
We’ll also think about making a demo with the screenshot functionality.
UPD For the record: now one can use our WordPress plugin for sending the configured order and screenshots to the server.
https://www.soft8soft.com/docs/manual/en/introduction/Wordpress-Plugin.htmlCo-founder and lead developer at Soft8Soft.
-
AuthorPosts
- You must be logged in to reply to this topic.