Использование mapboxgl.Popup в deck.gl
Я пытаюсь использовать встроенный объект mapboxgl.Popup, чтобы показать на маркере deck.gl IconLayer. Всплывающее окно показывает, но при вызове popup.remove() оно не удаляется. Я также не могу заставить курсор изменить на указатель либо. В консоли также не отображаются ошибки. Кажется, что-то заглушено на заднем плане.
onHover: (info) => {
if (info.object) {
map.getCanvas().style.cursor = 'pointer';
var coordinates = [info.object.geometry.coordinates.lon, info.object.geometry.coordinates.lat];
var description = info.object.name;
while (Math.abs(info.lngLat.lng - coordinates[0]) > 180) {
coordinates[0] += info.lngLat.lng > coordinates[0] ? 360 : -360;
}
const markerHeight = mapConfig.icon.height;
const markerRadius = mapConfig.icon.width / 2;
var linearOffset = Math.round(Math.sqrt(0.5 * Math.pow(markerRadius, 2)));
popup = new mapboxgl.Popup({
closeButton: false,
closeOnClick: false,
offset: {
'top': [0, 0],
'top-left': [0,0],//[linearOffset, (markerHeight - markerRadius - linearOffset) * -1],
'top-right': [0,0],//[-linearOffset, (markerHeight - markerRadius - linearOffset) * -1],
'bottom': [0, -markerHeight],
'bottom-left': [linearOffset, (markerHeight - markerRadius + linearOffset) * -1],
'bottom-right': [-linearOffset, (markerHeight - markerRadius + linearOffset) * -1],
'left': [markerRadius, (markerHeight - markerRadius) * -1],
'right': [-markerRadius, (markerHeight - markerRadius) * -1]
}
});
popup.setLngLat(coordinates)
.setHTML(description)
.addTo(map);
} else {
info.layer.context.gl.canvas.style.cursor = 'grab';
if (popup) {
popup.remove();
}
}
}