RTS game: Camera movement is wierd

I’m building an RTS game and I’m having a problem with the camera movement.

Whatever I move my mouse to the top sreen is not moving really moving the camera view in the front/left/right/back but instead is only changing the values in the axis and the movement is wierd.

So the green arrows is the movement I expect and the red arrows is the movement I get.

49994-screenshot-24.png

I want to say too that, In this game you can rotate the camera in the Y-axis in between 0 and 360 degrees. And in any rotation I want my camera to behave ALWAYS like the GREEN arrows.

 #pragma strict
  
  private var delta : Vector3 = Vector3.zero;
  private var lastPos : Vector3 = Vector3.zero;
  
  public var Boundary : int = 50; // distance from edge scrolling starts
  public var speed : int = 5;
  
  private var theScreenWidth : int;
  private var theScreenHeight : int;
  private var rotationSpeed : float;
  
  var minFov: float = 2f;
  var maxFov: float = 3f;
  var sensitivity: float = 10f;
  
  function Start() 
  {
      theScreenWidth = Screen.width;
      theScreenHeight = Screen.height;
  }
  
  function Update() 
  {
  
       var yCam : float = Camera.main.transform.eulerAngles.y;
  
      if (Input.mousePosition.x > theScreenWidth - Boundary)
      {
         transform.position.x += speed * Time.deltaTime; // move on +X axis
      }
  
      if (Input.mousePosition.x < 0 + Boundary)
      {
         transform.position.x -= speed * Time.deltaTime; // move on -X axis
      }
  
      if (Input.mousePosition.y > theScreenHeight - Boundary)
      {
         transform.position.z += speed * Time.deltaTime; // move on +Z axis
      }
  
      if (Input.mousePosition.y < 0 + Boundary)
      {
         transform.position.z -= speed * Time.deltaTime; // move on -Z axis
      }  
     
     //zoom cam
        var fov: float = Camera.main.orthographicSize;
        fov += -(Input.GetAxis("Mouse ScrollWheel")) * sensitivity;
        fov = Mathf.Clamp(fov, minFov, maxFov);
        Camera.main.orthographicSize = Mathf.Lerp (Camera.main.orthographicSize, fov, Time.deltaTime * sensitivity);
        
        //rotate cam
        if(Input.GetMouseButton(2)){
            if(Input.mousePosition.x > theScreenWidth/2){
                lastPos = Input.mousePosition;
                delta = Input.mousePosition - lastPos; 
                transform.eulerAngles -= new Vector3(0,(theScreenWidth/2-(lastPos.x))*0.01,0);
            }
            
         if(Input.mousePosition.x < theScreenWidth/2){
                lastPos = Input.mousePosition;
                delta = Input.mousePosition - lastPos;
                transform.eulerAngles += new Vector3(0,((lastPos.x)-theScreenWidth/2)*0.01,0);
            }
 
    }
    }

When editing the position, you should make sure it properly handles the current y-axis rotation of your camera.

Changing these lines (all 4 if’s, not just this one)

if (Input.mousePosition.x > theScreenWidth - Boundary)
{
    transform.position.x += speed * Time.deltaTime; // move on +X axis
}

To something like this:

if (Input.mousePosition.x > theScreenWidth - Boundary)
{
    Quaternion rotation = Quaternion.Euler(0,transform.rotation.eulerAngles.y,0);
    Vector3 movement = new Vector3(speed * Time.deltaTime, 0, 0); // move on +X axis
    
    transform.position += rotation * movement;
}

Should work. (If it doesn’t, please reply in the comments :p)

(My example is in C# because I’m used to coding in C#, but I think you’ll be able to convert this to Javascript yourself)

This is a RTS camera I’have created some time ago. Maybe it can help someone.
Post
Github link