I want to update the Part Number and Price on the right hand above Add To Cart button, on changing Color/Size configurations. I know the information lies within the configurator object and we can get it by configurator.getConfiguration() call. However, I want to get it when the event is fired, so what’s the event listener I am looking for?
Hi Suresh welcome to the forum. There are no built-in events on our configuration form at the moment.
Most of our implementations do not use Threekit’s off-the-shelf form, typically UI elements are created that fit in with the website’s larger design to drive configuration changes and if event listeners are needed, you can add them to your custom elements.
For example this is creating custom drop downs in react after all the item’s attributes have been saved in a a variable called attrs.
Is there no way I can grab the configurations upon changing of the Color/Size? Currently I am leveraging DOMsubtreemodified event, you will notice how i have used it on the page. But it doesn’t work like how i expected.
There are two approaches you can take. You can either take a snapshot with the client-side API or you can retrieve images on from the platform with our server-side API.
There is a small caveat with the snapshot technique: it creates an image from the current player’s viewport so if your user interacts with the model at all before taking a snapshot, that adjustment will be reflected in the snapshot. Be sure to either set a camera to position your item in the way you’d like or limit movement of the item in the platform.
I believe the server-side call may be your preference if you are trying to retrieve the fileId. You should not have to do any webgl renders since you already have images on the platform, this API call should get them to you.
Here are some posts that may help you, let me know if I can clarify anything:
I talked to our client and client said they have to train non technical people for the item and their asset setup, while catalog items setup is easy from the dashboard, the asset one is a little tricky when we are using import.js and layers api. It’s easy enough for the technical people like us. So, we decided we would go via the dashboard route for this. Phil created a canvas for us and we used the datatables approach with the assetId (image id) on the csv and that worked with the rules mapping. Now my question is, how can we just grab the image like with the layers api?
With the snapshot style, you mentioned, it carries the image data encoded, while this looks like it’s working, I want to store this on our database table and use it on other pages like cart/checkout/confirm pages. This is a very large field to store on the database table. Can I get a image url instead? Also, when we upload the images to the assets folder, it looks like it becomes a 3D rather than 2D. All we need is a simple 2D image url with the configuration selected.