ashatora/editor
1
0
Fork 0
mirror of https://github.com/maputnik/editor.git synced 2025-12-06 06:10:00 +00:00
Code Issues Projects Releases Wiki Activity

Another attempt to fix the inspect issues (#889)

Browse Source 
Fixes #871

- #871 

In case of same sources, calling the render method when the map style
changes, but not right away to let the map load the sources should fix
the issue.
This commit is contained in:
Harel M
2024-03-14 21:02:49 +02:00
committed by GitHub
parent 3c043fd5e0
commit 355b663e7e
1 changed files with 15 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/components/MapMaplibreGl.tsx
View File

@@ -90,21 +90,6 @@ export default class MapMaplibreGl extends React.Component<MapMaplibreGlProps, M
}
}
updateMapFromProps(props: MapMaplibreGlProps) {
if(!this.state.map) return
//Maplibre GL now does diffing natively so we don't need to calculate
//the necessary operations ourselves!
if (props?.mapStyle) {
if (!props.mapStyle.metadata) {
props.mapStyle.metadata = {};
}
}
this.state.map.setStyle(
this.props.replaceAccessTokens(props.mapStyle),
{diff: true}
)
}
shouldComponentUpdate(nextProps: MapMaplibreGlProps, nextState: MapMaplibreGlState) {
let should = false;
@@ -119,18 +104,26 @@ export default class MapMaplibreGl extends React.Component<MapMaplibreGlProps, M
componentDidUpdate() {
const map = this.state.map;
this.updateMapFromProps(this.props);
const styleWithTokens = this.props.replaceAccessTokens(this.props.mapStyle);
if (map) {
// Maplibre GL now does diffing natively so we don't need to calculate
// the necessary operations ourselves!
// We also need to update the style for inspect to work properly
map.setStyle(styleWithTokens, {diff: true});
map.showTileBoundaries = this.props.options?.showTileBoundaries!;
map.showCollisionBoxes = this.props.options?.showCollisionBoxes!;
map.showOverdrawInspector = this.props.options?.showOverdrawInspector!;
}
if(this.state.inspect && this.props.inspectModeEnabled !== this.state.inspect._showInspectMap) {
this.state.inspect.toggleInspector()
}
if (this.state.inspect && this.props.inspectModeEnabled) {
this.state.inspect!.setOriginalStyle(this.props.replaceAccessTokens(this.props.mapStyle));
}
if (map) {
map.showTileBoundaries = this.props.options?.showTileBoundaries!;
map.showCollisionBoxes = this.props.options?.showCollisionBoxes!;
map.showOverdrawInspector = this.props.options?.showOverdrawInspector!;
this.state.inspect.setOriginalStyle(styleWithTokens);
// In case the sources are the same, there's a need to refresh the style
setTimeout(() => {
this.state.inspect!.render();
}, 500);
}
}