如何终止Mapbox的map.on()函数? [英] How to terminate map.on() function for Mapbox?

问题描述

我使用了Mapbox JS API来显示坐标.这是文档的链接: https://docs.mapbox.com/mapbox-gl-js/example/mouse-position/

I used the Mapbox JS API for showing coordinates. This is the link of the document: https://docs.mapbox.com/mapbox-gl-js/example/mouse-position/

我有两个按钮.单击第一个鼠标后，当鼠标悬停在地图上时，它会显示坐标.

I have two buttons. After I click the first one, when the mouse is hovering the map, it shows the coordinates.

我想做的是单击第二个按钮后，先前运行的功能可以终止.你能帮我吗?

What I want to do is that after I click the second button, the previous running function can terminate. Can you help me on that?

function showCor() {
        map.on('mousemove', function (e) {
            document.getElementById('coord-info-lat').innerHTML =
                JSON.stringify(e.lngLat.lat.toFixed(5));

            document.getElementById('coord-info-lng').innerHTML =
                JSON.stringify(e.lngLat.lng.toFixed(5));
        });

}

function notShowCor() {
// Please help me here.
}

推荐答案

我通过设置isActive"标志解决了这个问题.这是我的代码.

I solved the problem by setting an 'isActive' flag. Here is my code.

let isActive = true;

//function to show the position
function showCor() {
    isActive = true;
    map.on('mousemove', function (e) {
        if (isActive) {
            document.getElementById('coord-info-lat').innerHTML =   
                JSON.stringify(e.lngLat.lat.toFixed(5));
            document.getElementById('coord-info-lng').innerHTML =
                JSON.stringify(e.lngLat.lng.toFixed(5));
        }

    });

}

//function to clear the info and terminate the function.
function notShowCor() {
    isActive = false;
    document.getElementById('coord-info-lat').innerHTML = 'N/A';
    document.getElementById('coord-info-lng').innerHTML = 'N/A';
}

请告知您是否有更好的解决方案.谢谢.

Please advise if you have better solutions. Thank you.

这篇关于如何终止Mapbox的map.on()函数?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！