javascript - 单击没有要素的 map 时隐藏弹出窗口

Question

我正在开发一个使用 openlayers 和 geoserver 显示弹出窗口的项目。我已经成功创建了显示弹出窗口的脚本。在那里，我使用 highcharts 库在弹出叠加层中创建图表。我在 map [地理服务器层]内有许多可用的图例或标记。

当用户单击 map 内的任何点时，我已成功生成弹出窗口。我的问题是，当单击不存在任何点的 map 时，我会收到一个空白的弹出窗口。

我尝试设置点击时没有数据解析的条件并设置为popup.hide();。

// map variable
var map = new ol.Map({
    controls: ol.control.defaults({
        attributionOptions:  ({
            collapsible: false // Make the attribution non collapsible
        })
    }).extend([mousePositionControl]),
    target: 'map',
    view: view // Set view
});



/*
  * Add a click handler to the map to render the popup.
*/

/*Attribute popup*/
/*Display the Data in a popup box*/

var popup = new ol.Overlay.Popup();
map.addOverlay(popup);


map.on('singleclick', function(evt) {


   popup.show(evt.coordinate,popup);    

});

Answer 1

你试过吗

reqwest({        
    url: urlIndia,
    type: 'json',
}).then(function (data) {
    if (data.features.length == 0) {
      popup.hide();
      return;
    }
    for (var i = 0; i < data.features.length; i++) 
    {