✨Globe: Position camera to current continent

Quite complex to figure out but needed to use spherical coordinates to apply to the camera, inspired from Three.js
Thanks @Tape on Discord/Three.js!

src/modules/globe/index.ts

@@ -16,11 +16,7 @@ export class Globe {
         this.width = this.el.offsetWidth
         this.height = this.el.offsetHeight
         this.markers = options.markers || []
-        this.globeZoom = 1.3075
-        this.globeRotation = {
-            lat: degToRad(-this.options.rotationStart) || 0,
-            // lng: degToRad(-this.options.rotationStart.lng) || 0,
-        }
+        this.zoom = 1.3075
 
         // Calculate the current sun position from a given location
         const locations = [
@@ -93,7 +89,12 @@ export class Globe {
 
         // Create camera
         this.camera = new Camera(this.gl)
-        this.camera.position.set(0, 0, this.globeZoom)
+        this.camera.position.set(setFromSphericalCoords(
+            this.zoom,
+            degToRad(this.options.rotationStart.y || 40), // phi: y
+            degToRad(this.options.rotationStart.x || 0), // theta: x
+        ))
+        this.camera.lookAt(0,0,0)
 
         // Create controls
         this.controls = new Orbit(this.camera, {
@@ -285,8 +286,7 @@ export class Globe {
 
         // Rotate globe if not dragging neither hovering marker
         if (this.params.autoRotate && !this.hoveringMarker) {
-            this.globeRotation.lat += this.params.speed * delta
-            this.globe.rotation.y = this.globeRotation.lat
+            this.globe.rotation.y += this.params.speed * delta
         }
 
         // Update controls and renderer
@@ -340,7 +340,7 @@ type Options = {
     autoRotate: boolean
     speed: number
     sunAngle: number
-    rotationStart?: number
+    rotationStart?: { x: number, y: number }
     enableMarkers?: boolean
     enableMarkersLinks?: boolean
     markers?: any[]
@@ -390,6 +390,19 @@ const latLonToVec3 = (lat: number, lng: number) => {
     return new Vec3(x,y,z)
 }
 
+
+/**
+ * Get position from spherical coordinates
+ */
+const setFromSphericalCoords = (radius: number, phi: number, theta: number) => {
+    const sinPhiRadius = Math.sin(phi) * radius
+    const x = sinPhiRadius * Math.sin(theta)
+    const y = Math.cos(phi) * radius
+    const z = sinPhiRadius * Math.cos(theta)
+
+    return new Vec3(x,y,z)
+}
+
 /**
  * Convert Degrees to Radians
  */