Implementation
const map = useMap()
...
useEffect(() => {
const options = {
apiKey: MAP_API_KEY,
} satisfies MaptilerLayerOptions
const mtLayer = new MaptilerLayer(options)
mtLayer.addTo(map)
return () => {
map.removeLayer(mtLayer)
}
}, [map])Error
leaflet - DfQJtl2Q.js: 868 Uncaught TypeError: Cannot read properties of undefined(reading 'setCenter')
at f._transformGL(leaflet - DfQJtl2Q.js: 868: 50146)
at f._update(leaflet - DfQJtl2Q.js: 868: 49677)
at f.X[as _throttledUpdate](leaflet - DfQJtl2Q.js: 4: 723)
at f.fire(leaflet - DfQJtl2Q.js: 4: 5468)
at f._onPanTransitionStep(leaflet - DfQJtl2Q.js: 4: 46610)
at f.fire(leaflet - DfQJtl2Q.js: 4: 5468)
at f._runFrame(leaflet - DfQJtl2Q.js: 4: 27340)
at f._step(leaflet - DfQJtl2Q.js: 4: 27159)
at f._animate(leaflet - DfQJtl2Q.js: 4: 27070) // ./leaflet-maptilersdk.js
...
_update: function() {
if (this._offset = this._map.containerPointToLayerPoint([0, 0]), this._zooming)
return;
const t = this.getSize(), i = this._map.getSize().multiplyBy(this.options.padding), o = this._map.containerPointToLayerPoint([0, 0]).subtract(i);
e.DomUtil.setPosition(this._container, this._roundPoint(o)), this._transformGL(), this._maptilerMap.transform.width !== t.x || this._maptilerMap.transform.height !== t.y ? (this._container.style.width = `${t.x}px`, this._container.style.height = `${t.y}px`, this._maptilerMap._resize !== null && this._maptilerMap._resize !== void 0 ? this._maptilerMap._resize() : this._maptilerMap.resize()) : this._maptilerMap._update !== null && this._maptilerMap._update !== void 0 ? this._maptilerMap._update() : this._maptilerMap.update();
},
_transformGL: function() {
this._maptilerMap.setCenter(this._map.getCenter()), this._maptilerMap.setZoom(this._map.getZoom() - 1);
},
...Environment
- @maptiler/leaflet-maptilersdk: 4.1.1
- leaflet: 1.9.4
- Browser: Mobile Safari UI/WKWebView
- OS: iOS 18.7
Possible Cause
The error suggests a race condition where the GL transformation is attempted before the underlying MapTiler SDK map instance is fully initialized, or after it has been removed/destroyed.
Unfortunately, the error cannot be reproduced locally.
Implementation
Error
Environment
Possible Cause
The error suggests a race condition where the GL transformation is attempted before the underlying MapTiler SDK map instance is fully initialized, or after it has been removed/destroyed.
Unfortunately, the error cannot be reproduced locally.