Использование 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();
                }
            }
        }

0 ответов

Другие вопросы по тегам