如何以编程方式关闭 HERE 地图上下文菜单？

Question

我有一个 HERE Maps 地图显示在一个简单的网页上，带有多选下拉菜单和几个按钮。我正在使用 contextmenu 事件在右键单击时显示上下文菜单，如下所示：

var map = new H.Map(
    document.getElementById('mapContainer'),
    maptypes.raster.normal.map,
    {
        zoom: 12,
        center: { lat: -33.81, lng: 150.78 },
        pixelRatio: window.devicePixelRatio || 1,
        engineType: H.map.render.RenderEngine.EngineType.P2D
    }
);

...

// an H.map.Polygon object we prepared earlier
polygonObject.addEventListener("contextmenu", handleContextMenu)

...

function handleContextMenu(evt) {
    // Don't do anything if the map itself is right-clicked/long-pressed
    if (evt.target === map) {
        return;
    }

    if (evt.target instanceof H.map.Polygon) {
        // Polygon-specific context menu items
        evt.items.push(new H.util.ContextItem({ label: "ABC123" }));
        evt.items.push(H.util.ContextItem.SEPARATOR);
        evt.items.push(new H.util.ContextItem({ label: "Do something", callback: function () { doSomething(evt) } }));
    }
}

这很好用，当右键单击多边形对象时显示上下文菜单，如果点击地图上的其他地方则自动关闭。但是，如果用户单击地图上外部页面上的另一个元素或与之交互，则上下文菜单不会关闭。

我找不到任何关于如何实现此行为的文档，并且 example that HERE Maps uses 也不会在单击地图外的某处时关闭上下文菜单。如果与另一个页面元素交互，是否有任何方法以编程方式或自动关闭地图上的上下文菜单？

Answer 1

有点老套，但您可以通过在页面中找到带有 h_context_menu class 的 div 手动从 DOM 中删除上下文菜单，并将其删除。这可能会对 UI class 产生一些意想不到的副作用，但从我的简短测试来看似乎工作正常。

使用JQuery：

$("div.h_context_menu").remove()

使用 ES6：

document.querySelector("div.h_context_menu").remove()

使用原版 JavaScript（与 Internet Explorer 兼容）：

var el = document.querySelector("div.h_context_menu");
el.parentNode.removeChild(el);

如何以编程方式关闭 HERE 地图上下文菜单？

How can I dismiss a HERE Maps context menu programmatically?

javascript

contextmenu

here-api

heremaps