Google Street View Rotate Camera With Device Gyroscope

Question

I'm building a mobile app using the Google Maps SDK for iOS and I'm trying to use the mobile device's gyroscope data to pan the camera around a panorama in Street View. I've setup a GMSPanoramaView and a GMSPanoramaCamera with initial positions. I'm using the method -updateCamera on GMSPanoramaView but am unable to smoothly pan across each panorama. If anyone has any idea how I can achieve this feature please let me know. Here is my code so far in the -viewDidLoad portion of my viewcontroller:

if manager.gyroAvailable {
        let queue = NSOperationQueue.mainQueue()
        manager.startGyroUpdatesToQueue(queue, withHandler: { (data, error) -> Void in

            NSOperationQueue.mainQueue().addOperationWithBlock({ () -> Void in
                // Update UI
                let cameraUpdate = GMSPanoramaCameraUpdate.rotateBy((data?.rotationRate.x.radiansToDegrees)!)
                self.panoView.updateCamera(cameraUpdate, animationDuration: 1)
            })
        })
    }

Answer 1

Following code is working in swift 3

if motionManager.isGyroAvailable {
        motionManager.startGyroUpdates(to: OperationQueue.main, withHandler: { (gyroData: CMGyroData?, error: Error?) in
            let y = gyroData!.rotationRate.y
            print("gyrodata: \(y)")
            let cameraUpdate = GMSPanoramaCameraUpdate.rotate(by: -CGFloat((gyroData?.rotationRate.y)!))
            panoView.updateCamera(cameraUpdate, animationDuration: 1)
          })
    }

Answer 2

Working code in Swift 4 (controls both left right and up down so wherever the phone points is where the view will be updated)

import GoogleMaps
import CoreMotion

class ViewController: UIViewController, GMSPanoramaViewDelegate  {

    let motionManager = CMMotionManager()

    override func loadView() {
        let panoView = GMSPanoramaView(frame: .zero)
        panoView.delegate = self
        self.view = panoView

        // you can choose any latitude longitude here, this is my random choice
        panoView.moveNearCoordinate(CLLocationCoordinate2D(latitude: 48.858, longitude: 2.284))

        motionManager.startDeviceMotionUpdates()

        if motionManager.isGyroAvailable {
            motionManager.startGyroUpdates(to: OperationQueue.main, withHandler: { (gyroData: CMGyroData?, error: Error?) in

                // needed to figure out the rotation
                let y = (gyroData?.rotationRate.y)!

                let motion = self.motionManager.deviceMotion

                if(motion?.attitude.pitch != nil) {
                    // calculate the pitch movement (up / down) I subtract 40 just as
                    // an offset to the view so it's more at face level.
                    // the -40 is optional, can be changed to anything.
                    let pitchCamera = GMSPanoramaCameraUpdate.setPitch( CGFloat(motion!.attitude.pitch).radiansToDegrees - 40 )

                    // rotation calculation (left / right)
                    let rotateCamera = GMSPanoramaCameraUpdate.rotate(by: -CGFloat(y) )

                    // rotate camera immediately
                    panoView.updateCamera(pitchCamera, animationDuration: 0)

                    // for some reason, when trying to update camera
                    // immediately after one another, it will fail
                    // here we are dispatching after 1 millisecond for success
                    DispatchQueue.main.asyncAfter(deadline: .now() + 0.0001, execute: {
                        panoView.updateCamera(rotateCamera, animationDuration: 0)
                    })

                }
            })
        }
    }

}


extension BinaryInteger {
    var degreesToRadians: CGFloat { return CGFloat(Int(self)) * .pi / 180 }
}

extension FloatingPoint {
    var degreesToRadians: Self { return self * .pi / 180 }
    var radiansToDegrees: Self { return self * 180 / .pi }
}

And do not forget to put this in your info.plist

Privacy - Motion Usage Description

Add a proper descriptor for why you need this data in the info.plist and that should properly configure your application.

Answer 3

I have easy way, in my project i use "CLLocationManagerDelegate" - func locationManager(_ manager: CLLocationManager, didUpdateHeading newHeading: CLHeading)

self.locationManager.startUpdatingHeading() // put this line on viewdidload for example

func locationManager(_ manager: CLLocationManager, didUpdateHeading newHeading: CLHeading) {
    self.panoramaView.animate(to: GMSPanoramaCamera(heading: newHeading.magneticHeading, pitch: newHeading.y, zoom: 1), animationDuration: 0.1)
}