如何在openlayers 5中使标记可拖动而不在我单击标记时触发拖动答案

【问题标题】：How to make a marker dragable in openlayers 5 without triggering drag when I click marker如何在openlayers 5中使标记可拖动而不在我单击标记时触发拖动
【发布时间】：2019-09-12 16:55:05
【问题描述】：

问题是，当我点击标记时，翻译事件也被触发，信息窗口弹出将启动两次。

如何停止触发onclick事件？

点击代码

map.on("click", function (e) {
        map.forEachFeatureAtPixel(e.pixel, function (feature, layer) {
            //do something

            var event = new CustomEvent('markerClick', {
                detail: {
                    marker: feature
                }
            });
            window.dispatchEvent(event);
        })
    });

window.addEventListener('markerClick', function (evt) {

        var marker = evt.detail.marker;
        infoWindowInnerHtml(marker, marker.object.name, marker.object.label);
    });

拖码

var startDrag = 函数（标记）{

var translate = new ol.interaction.Translate({
    features: new ol.Collection([marker])
});
map.addInteraction(translate);

translate.on('translateend', function (evt) {

    //const coords_click = ol.proj.transform(evt.coordinate, 'EPSG:3857', map.getView().getProjection());
    const coords_click = ol.proj.transform(evt.coordinate, 'EPSG:3857', 'EPSG:4326');
    // MOUSE CLICK: Longitude
    const lon = parseFloat(coords_click[0]);
    // MOUSE CLICK: Latitude
    const lat = parseFloat(coords_click[1]);

    const data_for_url = {lon: lon, lat: lat, format: "json", limit: 1};
    const encoded_data = Object.keys(data_for_url).map(function (k) {
        return encodeURIComponent(k) + '=' + encodeURIComponent(data_for_url[k])
    }).join('&');

    $.get('https://nominatim.openstreetmap.org/reverse?' + encoded_data, function (data) {

        marker.position.lng = function () {
            return parseFloat(lon);
        };
        marker.position.lat = function () {
            return parseFloat(lat);
        };
        marker.object['object_address'] = formatAddress(data.address);
        var name = formatName(data.address);

        infoWindowInnerHtml(marker, name, marker.object['object_address']);
    });
});

};

【问题讨论】：

尝试使用map.on('singleclick', ..。（定义为“真正的单击，无需拖动，无需双击”）
translate.on('translateend', 函数 (evt) {
translate.on('translateend', function (evt) { makse 也可以点击，但我不想这样

标签： click drag openlayers-5

【解决方案1】：

您可以尝试这样的方法来检测翻译过程中的点击

var translating = false;

map.on("singleclick", function (e) {
    if (!translating) {

            //do something

    }
});


translate.on('translatestart', function (evt) {
    translating = true;
});

translate.on('translateend', function (evt) {

            //do something else

    translating = false;
});

【讨论】：