fix rotation * -1

mapbox · Jul 2, 2021 · 5b56818 · 5b56818
1 parent 4c64866
commit 5b56818
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/src/ui/control/geolocate_control.js b/src/ui/control/geolocate_control.js
@@ -349,8 +349,8 @@ class GeolocateControl extends Evented {
      */
     _updateMarkerRotation() {
         if (this._userLocationDotMarker && typeof this._heading === 'number') {
-            this._dotElement.classList.add('mapboxgl-user-location-show-heading');
             this._userLocationDotMarker.setRotation(this._heading);
+            this._dotElement.classList.add('mapboxgl-user-location-show-heading');
         } else {
             this._dotElement.classList.remove('mapboxgl-user-location-show-heading');
             this._userLocationDotMarker.setRotation(0);
@@ -493,7 +493,8 @@ class GeolocateControl extends Evented {
     */
     _onDeviceOrientation(deviceOrientationEvent: DeviceOrientationEvent) {
         if (this._userLocationDotMarker) {
-            this._heading = deviceOrientationEvent.alpha;
+            // alpha increases counter clockwise around the z axis
+            this._heading = deviceOrientationEvent.alpha * -1;
             this._updateMarkerRotationThrottled();
         }
     }

diff --git a/test/unit/ui/control/geolocate.test.js b/test/unit/ui/control/geolocate.test.js
@@ -590,13 +590,13 @@ test('GeolocateControl watching device orientation event', (t) => {
         t.ok(geolocate._userLocationDotMarker._map, 'userLocation dot marker on map');
         t.notOk(geolocate._userLocationDotMarker._element.classList.contains('mapboxgl-user-location-dot-stale'), 'userLocation does not have stale class');
         geolocate.once('trackuserlocationend', () => {
-            const event = deviceOrientationEventLike(359);
+            const event = deviceOrientationEventLike(-359);
             window.dispatchEvent(event);
             setImmediate(() => {
                 t.ok(geolocate._dotElement.classList.contains('mapboxgl-user-location-show-heading'), 'userLocation should have heading');
                 t.equal(geolocate._userLocationDotMarker._rotation, 359, 'userLocation rotation is not rotated by 359 degrees');
 
-                const event = deviceOrientationEventLike(15);
+                const event = deviceOrientationEventLike(-15);
                 window.dispatchEvent(event);
                 setImmediate(() => {
                     t.equal(geolocate._userLocationDotMarker._rotation, 15, 'userLocation rotation is not rotated by 15 degrees');