Button HTML change camera position

Help & Support
1

Hi, i started with the model viewer scene and i add a html button to change position of the camera.

...
var camera = this.camera;
...
if (button) {
        button.addEventListener('click', function() {
        camera.setPosition(0,0,0);
}
....

Dont work. I think its because orbit camera or i dont know, i dont get any error, only the camera dont move on position (0,0,0). What can i do ?

Thank you.

2

Can you share an example project please? Code looks fine at a glance

3

i created this example project

https://playcanvas.com/project/954355/overview/model-viewer

4

Hey, the orbit camera script is continuously changing the position of the camera. You will need to pause updating the position in order to set it manually by yourself.

5

Hi, Its not posibile to let zoom, left, right work and only change the position?
Because if i stop updating camera then zoom, left,right etc dont work.

6

The orbit camera position is controller through it’s API in the script. If you look at the Orbit Camera script PlayCanvas | HTML5 Game Engine

You can see properties that you can change. Eg pitch and yaw

If you want to move the camera to a specific point, I suggest using the functions resetAndLookAtPoint or resetAndLookAtEntity

Example: PlayCanvas 3D HTML5 Game Engine

    var button = this.div.querySelector('.button2222');
    if (button) {
        button.addEventListener('click', function() {
            var lookAtPos = camera.script.orbitCamera.pivotPoint.clone();
            camera.script.orbitCamera.resetAndLookAtPoint(new pc.Vec3(10,10,5), lookAtPos);
        }
        );
    }
1 Like
7

Thank you yaustar. Work now.