Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug fix: implement onLoad event calling when reuseMaps is set to true #704

Merged
merged 7 commits into from
Jan 28, 2019
4 changes: 4 additions & 0 deletions examples/reuse-map/src/bart-map.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,9 @@ export default class BartMap extends Component {

_onViewportChange = viewState => this.setState({viewState});

// eslint-disable-next-line no-alert
_onMapLoad = (event) => alert('Fire MapGL onLoad event');

_renderMarker(station, i) {
const {name, coordinates} = station;
return (
Expand All @@ -40,6 +43,7 @@ export default class BartMap extends Component {
width="100%"
height="100%"
onViewportChange={this._onViewportChange}
onLoad={this._onMapLoad}

reuseMaps={true}
>
Expand Down
25 changes: 19 additions & 6 deletions src/mapbox/mapbox.js
Original file line number Diff line number Diff line change
Expand Up @@ -224,7 +224,7 @@ export default class Mapbox {
}

// PRIVATE API

// eslint-disable-next-line max-statements
_create(props: Props) {
// Reuse a saved map, if available
if (props.reuseMaps && Mapbox.savedMap) {
Expand All @@ -242,13 +242,26 @@ export default class Mapbox {
this._map._container = newContainer;
Mapbox.savedMap = null;

// Update style
// Step3: update style and call onload again
const fireLoadEvent = () => props.onLoad({
type: 'load',
target: this._map
});

if (props.mapStyle) {
this._map.setStyle(props.mapStyle);
this._map.setStyle(props.mapStyle, {
diff: true
});

// call onload event handler after style fully loaded when style needs update
if (this._map.isStyleLoaded()) {
fireLoadEvent();
} else {
this._map.once('styledata', fireLoadEvent);
}
} else {
fireLoadEvent();
}

// TODO - need to call onload again, need to track with Promise?
props.onLoad();
} else {
if (props.gl) {
const getContext = HTMLCanvasElement.prototype.getContext;
Expand Down