首页 > 解决方案 > 获取Leaflet中单击坐标上重叠多边形中的所有相交特征

问题描述

我无法获取重叠多边形中的所有相交要素。

我想要做的是,当用户点击地图时,它会在点击的坐标上显示所有特征,我已经完成了这个,但问题是它也会捕获附近的多边形,即使它没有相互重叠。

我当前的代码如下所示:

map = new L.Map('map_div', { center: new L.LatLng(x, y), zoom: 9 });

map.on('click', clickHandler);

function clickHandler(e) {

    var clickBounds = L.latLngBounds(e.latlng, e.latlng);
    var intersectingFeatures = [];
    for (var l in map._layers) {
        var overlay = map._layers[l];
        if (overlay._layers) {
            for (var f in overlay._layers) {
                var feature = overlay._layers[f];
                var bounds;
                if (feature.getBounds) bounds = feature.getBounds();
                else if (feature._latlng) {
                    bounds = L.latLngBounds(feature._latlng, feature._latlng);
                }
                if (bounds && clickBounds.intersects(bounds)) {
                    intersectingFeatures.push(feature);
                }
            }
        }
    }
    var html = intersectingFeatures.map(function (o) {
        try {
            return '<pre>' + JSON.stringify(o.feature.properties, null, ' ').replace(/[\{\}"]/g, '') + '</pre>';
        } catch (err) {
            console.log("no feature found");
            return '';
        }
    }).join('<br />');

    map.openPopup(html, e.latlng, {
        offset: L.point(0, -24)
    });
}

输出:

地图输出

标签: jqueryleaflet

解决方案


推荐阅读