Location Picker catch instantiation errors e.g WebGL disabled (#7296)

pull/21833/head
Michael Telatynski 2021-12-07 09:31:13 +00:00 committed by GitHub
parent 26297f5498
commit e2ed00db85
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 30 additions and 24 deletions

View File

@ -107,31 +107,37 @@ class LocationPicker extends React.Component<IProps, IState> {
zoom: 1, zoom: 1,
}); });
// Add geolocate control to the map. try {
this.geolocate = new maplibregl.GeolocateControl({ // Add geolocate control to the map.
positionOptions: { this.geolocate = new maplibregl.GeolocateControl({
enableHighAccuracy: true, positionOptions: {
}, enableHighAccuracy: true,
trackUserLocation: true, },
}); trackUserLocation: true,
this.map.addControl(this.geolocate); });
this.map.addControl(this.geolocate);
this.map.on('error', (e) => { this.map.on('error', (e) => {
logger.error("Failed to load map: check map_style_url in config.json has a valid URL and API key", e.error); logger.error("Failed to load map: check map_style_url in config.json has a valid URL and API key",
e.error);
this.setState({ error: e.error });
});
this.map.on('load', () => {
this.geolocate.trigger();
});
this.map.on('click', (e) => {
this.addMarker(e.lngLat);
this.storeManualPosition(e.lngLat);
this.setState({ type: LocationShareType.Custom });
});
this.geolocate.on('geolocate', this.onGeolocate);
} catch (e) {
logger.error("Failed to render map", e.error);
this.setState({ error: e.error }); this.setState({ error: e.error });
}); }
this.map.on('load', () => {
this.geolocate.trigger();
});
this.map.on('click', (e) => {
this.addMarker(e.lngLat);
this.storeManualPosition(e.lngLat);
this.setState({ type: LocationShareType.Custom });
});
this.geolocate.on('geolocate', this.onGeolocate);
} }
private addMarker(lngLat: maplibregl.LngLat): void { private addMarker(lngLat: maplibregl.LngLat): void {
@ -169,7 +175,7 @@ class LocationPicker extends React.Component<IProps, IState> {
} }
componentWillUnmount() { componentWillUnmount() {
this.geolocate.off('geolocate', this.onGeolocate); this.geolocate?.off('geolocate', this.onGeolocate);
} }
private onGeolocate = (position: GeolocationPosition) => { private onGeolocate = (position: GeolocationPosition) => {