0

我正在尝试使用 Mapbox/Turfjs 来了解多边形中有多少个点。我已经在 map.onload 中渲染了我的多边形和点然后可以在多边形和点被渲染到地图之后从另一个函数调用 Turf.js 吗？

像这样的东西……？

$(document).ready(function(){

    mapboxgl.accessToken = 'eeeeeeeeee';

    map = new mapboxgl.Map({
        container: 'map',
        style: 'mapbox://styles/mapbox/streets-v9',
        center: [ 32.62939453125,1.7355743631421197], 
        zoom: 6.5,
        pitch: 40,          
        maxZoom: 17
    });


    map.on('load', function () {

        //geofence data
        map.addSource('fencedata', {
            type: 'geojson',
            data: 'data/fence.geojson'
        });

        map.addLayer({
            id: 'fence',
            type: 'fill',
            "source": "fencedata",
            'layout': {},
            'paint': {
                'fill-color': '#FF0000',
                'fill-opacity': 0.3
            }
        });


        //points data
        map.addSource("pointdata", {
            type: "geojson",
            data: 'data/points.geojson',
            cluster: true,
            clusterRadius: 20 
        });

        map.addLayer({
            "id": "points",
            "type": "circle",
            "source": "pointdata",
            "paint": {
                'circle-color': 'rgba(255, 255, 46, 1.0)',
                'circle-radius': 8
            }
        });


    });

    map.addControl(new mapboxgl.NavigationControl());



});


geofence();    


function geofence(){

    var ptsWithin = turf.within(points, fence);
}
4

2 回答 2

0

添加这些图层后尝试geofence()在地图加载功能中添加该功能，这样您可以确保geofence()在加载图层后调用该功能

    map.on('load', function () {

    //geofence data
    map.addSource('fencedata', {
        type: 'geojson',
        data: 'data/fence.geojson'
    });

    map.addLayer({
        id: 'fence',
        type: 'fill',
        "source": "fencedata",
        'layout': {},
        'paint': {
            'fill-color': '#FF0000',
            'fill-opacity': 0.3
        }
    });


    //points data
    map.addSource("pointdata", {
        type: "geojson",
        data: 'data/points.geojson',
        cluster: true,
        clusterRadius: 20
    });

    map.addLayer({
        "id": "points",
        "type": "circle",
        "source": "pointdata",
        "paint": {
            'circle-color': 'rgba(255, 255, 46, 1.0)',
            'circle-radius': 8
        }
    });
    geofence();
  });
map.addControl(new mapboxgl.NavigationControl());
});

function geofence() {
   var ptsWithin = turf.within(points, fence);
}
于 2017-06-21T09:01:19.163 回答
0

您的点为 GeoJSON，多边形为 GeoJSON - 所以，是的，您可以使用 TurfJS 找出多边形内的点。看起来您提出的代码是正确的。您使用 Mapbox 的事实与此特定任务无关。

如果您在使用这种方法时遇到问题，请在您的问题中指出。

于 2017-06-21T02:25:41.037 回答