[geolocate] fix auto when location blocked (visgl#1126)

Author: anuragkyal

examples/controls/src/app.js

@@ -1,7 +1,13 @@
 import * as React from 'react';
 import {Component} from 'react';
 import {render} from 'react-dom';
-import MapGL, {Popup, NavigationControl, FullscreenControl, ScaleControl} from 'react-map-gl';
+import MapGL, {
+  Popup,
+  NavigationControl,
+  FullscreenControl,
+  ScaleControl,
+  GeolocateControl
+} from 'react-map-gl';
 
 import ControlPanel from './control-panel';
 import Pins from './pins';
@@ -11,20 +17,27 @@ import CITIES from '../../.data/cities.json';
 
 const TOKEN = ''; // Set your mapbox token here
 
-const fullscreenControlStyle = {
+const geolocateStyle = {
   position: 'absolute',
   top: 0,
   left: 0,
   padding: '10px'
 };
 
-const navStyle = {
+const fullscreenControlStyle = {
   position: 'absolute',
   top: 36,
   left: 0,
   padding: '10px'
 };
 
+const navStyle = {
+  position: 'absolute',
+  top: 72,
+  left: 0,
+  padding: '10px'
+};
+
 const scaleControlStyle = {
   position: 'absolute',
   bottom: 36,
@@ -90,6 +103,9 @@ export default class App extends Component {
 
         {this._renderPopup()}
 
+        <div style={geolocateStyle}>
+          <GeolocateControl />
+        </div>
         <div style={fullscreenControlStyle}>
           <FullscreenControl />
         </div>

src/components/geolocate-control.js

@@ -115,7 +115,7 @@ export default class GeolocateControl extends BaseControl<
     isGeolocationSupported().then(result => {
       this.setState({supportsGeolocation: result});
       this._setupMapboxGeolocateControl(result);
-      if (this.props.auto) {
+      if (result && this.props.auto) {
         this._triggerGeolocate();
       }
     });