Snapshot from different view

Hi,

we have a requirement, where client want 3 snapshots after configuring the product

  1. Top View
  2. Side View
  3. Default view.
    We have created 3 different cameras and added a parameter. Added a custom code to change the cameras and provide the screenshot.

Issue:
If the user rotate the object on default camera the alignment in other cameras also get impacted. how we can fix this problem.

Hi Prashant,

You should be able to activate those cameras consistently, I do not expect interaction from a user to change the alignment or position of the object when the cameras are rotated.

Can you elaborate on what is happening when you try to take the snapshots? Can you confirm the cameras are active before taking the snapshots?

Hello Will,

There are totally 4 cameras in the scene . One is default camera . And three to take snapshots . The user interacts with objects in the player and make changes in the attributes . The user turn the object also .
Now when he click for snapshot options , we are changing the active camera to three camera one by one and taking snapshot . Because the user has rotated the object the alignment mismatches . The view is correct

code
window.threekit.configurator.setConfiguration({“Camera”:“Top”});
d[“Top”]= await window.threekit.api.snapshotAsync();

    window.threekit.configurator.setConfiguration({"Camera":"Side"});
    d["Side"]=await window.threekit.api.snapshotAsync();
    
    window.threekit.configurator.setConfiguration({"Camera":"Default"});
    d["Default"]=await window.threekit.api.snapshotAsync();

*removed link to asset - Will

Hi Prashant, this should be an easy fix. The issue seems to be that your scene is using the Top camera as the scene’s camera as well as a point for the snapshot.

This means that when you have a user interacting with the model and spinning it around, they are quite literally changing the angle of this camera, which in turn skews the angles of the Snapshot.

If you remove the scene camera parameter or use a separate camera that is not used for the snapshots, this should result in expected behavior.

Hello Will @Will
The parameter is exposed but not to the end user . The parameter is exposed to set the camera while taking snapshot only .

Yes but if you use one of those same cameras for your scene and the user moves the item, it will affect the camera angles in the future. They do not need an attribute to change the camera angle if that camera is used for the scene.

I would suggest using a separate camera for your scene and not any of the ones you are using for your snapshot. See the scene I DMd you for reference.

@Will
thanks Will for creating the sample scene.

The reason why I created 4 cameras was

  1. One is default camera for the project.
  2. 3 cameras for the screenshot.

Earlier we had only 3 as you have suggested. The problem with three only was, when we set the cameras to take screenshot , in the end the the last camera chosen to take photo graph is selected. and if the user has roatated the object it will reset to last camera position.

So we have created a 4th camera. we are saving the position of the default camera before taking screenshot and resetting it to 4 camera again. but then alignment of the table get reset.

vCampos=window.threekit.api.camera.getPosition();

    var d = {} //for screenshots

    vCamQuat=window.threekit.api.camera.getQuaternion();

        

    window.threekit.configurator.setConfiguration({"Camera":"Top"});

    d["Top"]= await window.threekit.api.snapshotAsync();

    

    window.threekit.configurator.setConfiguration({"Camera":"Side"});

    d["Side"]=await window.threekit.api.snapshotAsync();

    

    window.threekit.configurator.setConfiguration({"Camera":"Default"});

    d["Default"]=await window.threekit.api.snapshotAsync();

    


    window.threekit.configurator.setConfiguration({"Camera":"onLoad"});

    window.threekit.api.camera.setPosition(vCampos);

    window.threekit.api.camera.setQuaternion(vCamQuat);

Sorry maybe I am misunderstanding - can you confirm that the camera you have selected in your Scene’s Player section is different than any of the cameras you are using for the snapshots?

If the camera selected for your scene is the same as any you use in setConfiguration({...}) you may encounter the issue.

Yes, the camera used for screenshot is differnet from the camera used in the scene.

We are setting the different cameras using the code. an then setting it back to scene camera.

I believe, in the scene/asset you linked originally, the camera used in the scene is the same as a camera that is used for the snapshot and they must be different.

In your scene, the camera used is Top.

In your cameras available for screenshots, you have Top available here as well.
image

This means that any time someone interacts with your scene, they are moving the camera Top. When you select Top to capture the screenshot, it will be different from where you expect it because it has been moved. You need to create camera in your scene that is not the same as Top.

This is still the scene you are referencing, correct? If so, please be sure to check the player settings in the scene and not in the logic.

Be aware there is also a camera field on the snapshotAsync call that will take a snapshot from a specific camera:

{
   size: {width: 123, height: 456},
   mimeType: 'image/jpeg', // 'image/jpeg', 'image/png', or 'image/webp'
   cameraId: "fdad61da-ce68-41e7-aafc-fbff9e8f6e9e"
}

From here: Snapshot

1 Like