CODEWITHSUNDEEP
c#mathunity-game-engine3dgeometry
Luca Hofmann
Luca Hofmann

Reputation: 1522

Creating a Google Earth like navigation for a sphere

This question is about Unity3D. I want to create a navigation similar to Google Earth where you click and drag on a sphere and let the camera orbit accordingly. It is important that the point that was grabbed is always under the mouse position while dragging. The navigation should also work if I zoom close to the sphere. I do not want to rotate the sphere itself. Just exactly like Google Earth does it.

My attempt is to project the mouse position to the sphere if I start to drag. On the next frame I do the same and calculate the angle between the start drag and end drag position.

enter image description here

private void RotateCamera(Vector3 dragStart, Vector3 dragEnd)
{
    // calc the rotation of the drag
    float angle = Vector3.Angle(dragStart, dragEnd);
    // rotate the camera around the sphere 
    Camera.main.transform.RotateAround(sphere), Vector3.up, angle);
}

I thought of using Unitys RotateAround method to rotate the camera with the calculated angle. Unfortunately I do not have the rotation vector (using Vector3.up in the example is obviously wrong). Does somebody know how I can calculate this vector to apply it for the method? Am I on the right direction to implement the Google Earth navigation?

Thank You!

UPDATE I am very close with a new solution. I project the drag vectors to a down and a right plane to get the angles. Afterwards I rotate the camera around up and left. This works well until I reach the poles of the sphere. The camera rotates a lot around itself if I reach a pole.

private void RotateCamera(Vector3 dragStart, Vector3 dragEnd)
{
    Vector3 plane = Vector3.down;
    var a = Vector3.ProjectOnPlane(dragStart, plane);
    var b = Vector3.ProjectOnPlane(dragEnd, plane);
    float up = Vector3.SignedAngle(a, b, plane);

    plane = Vector3.right;
    a = Vector3.ProjectOnPlane(dragStart, plane);
    b = Vector3.ProjectOnPlane(dragEnd, plane);
    float left = Vector3.SignedAngle(a, b, plane);

    Camera.main.transform.RotateAround(_sphere, Vector3.up, up);
    Camera.main.transform.RotateAround(_sphere, Vector3.left, left);
}

Upvotes: 1

Views: 1561

Answers (2)

Luca Hofmann
Luca Hofmann

Reputation: 1522

Turns out that is was easier than I expected. I thought about calculating the rotation axis and came to the conclusion that is must be the cross product of the start and end vector. Take a look at the solution. The RotateCamera method is where the math magic happens :) 

public class GoogleEarthControls : MonoBehaviour
{
    private const int SpehreRadius = 1;
    private Vector3? _mouseStartPos;
    private Vector3? _currentMousePos;

    void Start () {
        // init the camera to look at this object
        Vector3 cameraPos = new Vector3(
            transform.position.x, 
            transform.position.y, 
            transform.position.z - 2);

        Camera.main.transform.position = cameraPos;
        Camera.main.transform.LookAt(transform.position);
    }

    private void Update()
    {
        if (Input.GetMouseButtonDown(0)) _mouseStartPos = GetMouseHit();
        if (_mouseStartPos != null) HandleDrag();
        if (Input.GetMouseButtonUp(0)) HandleDrop();
    }

    private void HandleDrag()
    {
        _currentMousePos = GetMouseHit();
        RotateCamera((Vector3) _mouseStartPos, (Vector3)_currentMousePos);
    }

    private void HandleDrop()
    {
        _mouseStartPos = null;
        _currentMousePos = null;
    }

    private void RotateCamera(Vector3 dragStartPosition, Vector3 dragEndPosition)
    {
        // in case the spehre model is not a perfect sphere..
        dragEndPosition = dragEndPosition.normalized * SpehreRadius;
        dragStartPosition = dragStartPosition.normalized * SpehreRadius;
        // calc a vertical vector to rotate around..
        var cross = Vector3.Cross(dragEndPosition, dragStartPosition);
        // calc the angle for the rotation..
        var angle = Vector3.SignedAngle(dragEndPosition, dragStartPosition, cross);
        // roatate around the vector..
        Camera.main.transform.RotateAround(transform.position, cross, angle);
    }

    /**
     * Projects the mouse position to the sphere and returns the intersection point. 
     */
    private static Vector3? GetMouseHit()
    {
        // make sure there is a shepre mesh with a colider centered at this game object
        // with a radius of SpehreRadius
        RaycastHit hit;
        if (Physics.Raycast(Camera.main.ScreenPointToRay(Input.mousePosition), out hit))
        {
            return hit.point;
        }
        return null;
    }
}

Upvotes: 3

moon cheese
moon cheese

Reputation: 471

Basic rotation based on mouse drag, based on what you have:

Transform camTransform = Camera.main.transform;
if (Input.GetMouseButton(0))
{
    camTransform.RotateAround(currentLookTargetTransform.position, -camTransform.right * Input.GetAxis("Mouse Y") + camTransform.up * Input.GetAxis("Mouse X"), 120 * Time.deltaTime);
}

You can multiply the relative direction by the mouse change value to get the axis. Then you can supplant your clamp points in; but the point was to rotate it relatively.

Upvotes: 1

Related Questions