Add option to disable rotation

Author: nikmolnar

lib/Mapbox/Map.js

@@ -10,6 +10,7 @@ export default class Map extends React.Component {
         bounds: PropTypes.array.isRequired,
         minZoom: PropTypes.number,
         maxZoom: PropTypes.number,
+        disableRotation: PropTypes.bool,
 
         onPan: PropTypes.func,
         onZoom: PropTypes.func,
@@ -19,6 +20,7 @@ export default class Map extends React.Component {
     static defaultProps = {
         minZoom: 3,
         maxZoom: 16,
+        disableRotation: false,
         onPan: () => {},
         onZoom: () => {},
         onZoomEnd: () => {}
@@ -43,7 +45,7 @@ export default class Map extends React.Component {
     }
 
     componentDidMount() {
-        const { minZoom, maxZoom, onPan, onZoom, onZoomEnd, bounds } = this.props
+        const { minZoom, maxZoom, disableRotation, onPan, onZoom, onZoomEnd, bounds } = this.props
 
         this.map = new mapboxgl.Map({
             container: this.mapNodeRef.current,
@@ -54,6 +56,11 @@ export default class Map extends React.Component {
             attributionControl: false
         })
 
+        if (disableRotation) {
+            this.map.dragRotate.disable()
+            this.map.touchZoomRotate.disableRotation()
+        }
+
         this.map.boxZoom.disable()
         this.map.addControl(new mapboxgl.AttributionControl(), 'bottom-left')
 
@@ -88,10 +95,21 @@ export default class Map extends React.Component {
     }
 
     componentDidUpdate(prevProps) {
-        const { bounds } = this.props
+        const { bounds, disableRotation } = this.props
         if (!arraysAreEqual(prevProps.bounds, bounds)) {
             this.map.fitBounds(bounds)
         }
+
+        if (prevProps.disableRotation !== disableRotation) {
+            if (disableRotation) {
+                this.map.dragRotate.disable()
+                this.map.touchZoomRotate.disableRotation()
+            }
+            else {
+                this.map.dragRotate.enable()
+                this.map.touchZoomRotate.enableRotation()
+            }
+        }
     }
 
     updateStyle = () => {