我正在尝试使用内置的 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();
}
}
}