Camera zoomIn and zoomOut gesture in a mobile game

Help & Support
1

I’m programming a mobile game and I want to get the effect of zooming in when two fingers on the screen and when I separate them I do the same, the problem is that I have to move on the X axis and Z axis also to give the zooming sensation if someone could help me I share my code here

CameraMovement.prototype.touchStart = function (e) {
    if (e.touches.length === 2) {
 this.postionsZoom.positionTouchA1 = e.touches[0];
this.postionsZoom.positionTouchA2 = e.touches[1];

        this.middleDistanceX = (this.postionsZoom.positionTouchA1.x + this.postionsZoom.positionTouchA2.x) / 2;

        this.middleDistanceZ = (this.postionsZoom.positionTouchA1.z + this.postionsZoom.positionTouchA2.z) / 2;
    }

    e.event.preventDefault();

};
CameraMovement.prototype.touchMove = function (e) {
    //two fingers in the screen make zoom
    if (e.touches.length === 2) {
        this.makeZoomIn(e);
    }

};
CameraMovement.prototype.makeZoomIn = function (e) {
 this.postionsZoom.positionTouchB1 = e.touches[0];
    this.postionsZoom.positionTouchB2 = e.touches[1];
let firstTouch1 = new pc.Vec2(this.postionsZoom.positionTouchA1.x, this.postionsZoom.positionTouchA1.z);

     let secondTouch1 = new pc.Vec2(this.postionsZoom.positionTouchA2.x, this.postionsZoom.positionTouchA2.z);

     let firstTouch2 = new pc.Vec2(this.postionsZoom.positionTouchB1.x, this.postionsZoom.positionTouchB1.z);

    // let secondTouch2 = new pc.Vec2(this.postionsZoom.positionTouchB2.x, this.postionsZoom.positionTouchB2.z);

    let firstDistance = firstTouch1.distance(secondTouch1);

  let secondDistance = firstTouch2.distance(secondTouch2);
let distance = firstDistance - secondDistance;

//calculate the zoom speed depending on the distance between the two points
    let dy = this.postionsZoom.positionTouchA1.z - this.postionsZoom.positionTouchA2.z;

 let dx = this.postionsZoom.positionTouchA1.x - this.postionsZoom.positionTouchA2.x;

 let new_dy = this.postionsZoom.positionTouchB1.z - this.postionsZoom.positionTouchB2.z;
 let new_dx = this.postionsZoom.positionTouchB1.x - this.postionsZoom.positionTouchB2.x;
let scale = (Math.hypot(new_dy, new_dx) / Math.hypot(dy, dx)) / 4;

this.sensibilityZoom=10;
     if (distance > this.sensibilityZoom) {

    this.camera.setPosition( this.middleDistanceX, this.camera.getlocalPosition().y+0.5, this.middleDistanceZ);

     }

    else if (distance < -this.sensibilityZoom)
  this.camera.setPosition( this.middleDistanceX, this.camera.getlocalPosition().y-0.5, this.middleDistanceZ);

this.postionsZoom.positionTouchA1 = e.touches[0];
this.postionsZoom.positionTouchA2 = e.touches[1];

thank you in advance and happy holidays

2

The orbit camera has this functionality so you can probably adapt the input code used in that for your game: Orbit camera | Learn PlayCanvas

3

maybe I can adapt the touchinput.js code for what I want to do, thanks.