Question

我有1000个地理数据点，我有一张美国地图。我想在这1000个地理数据点中的每一个上创建小圆圈。我的数据是geojson格式。我可以一次创建一个圆圈。但是，如何循环数据集以在每个点创建圆圈？

这是我的圈子代码：

var circle = L.circle([64.837778, -147.716389], 500, {
        color: 'black',
        fillColor: '#000',
        fillOpacity: 0.8
    }).addTo(map);

Answer 1

您应该使用L.GeoJSON来呈现数据。它是为渲染GeoJSON数据而制作的。它有一个pointToLayer功能，您可以使用它来指向圆形，圆形标记或任何您想要的点。事实上，Leaflet网站上的示例部分有一个确切的例子，说明您要完成的任务：

L.geoJson(someGeojsonFeature, {
    pointToLayer: function (feature, latlng) {
        return L.circleMarker(latlng, geojsonMarkerOptions);
    }
}).addTo(map);

您可以使用GeoJSON图层渲染单个要素或整个featureCollections，请查看网站上的示例：http://leafletjs.com/examples/geojson.html

编辑：根据要求，整个例子：

首先，您要开始使用GeoJSON featureCollection：

var featureCollection = [{
    "type": "Feature",
    "properties": {},
    "geometry": {
        "type": "Point",
        "coordinates": [-104.99, 39.73]
    }
},{
    "type": "Feature",
    "properties": {},
    "geometry": {
        "type": "Point",
        "coordinates": [-104.96, 39.73]
    }
}];

使用featureCollection：

实现GeoJSON图层

var geoJsonLayer = L.geoJson(featureCollection, {
    pointToLayer: function (feature, latlng) {
        return L.circleMarker(latlng, {
            radius: 8,
            fillColor: "#ff7800",
            color: "#000",
            weight: 1,
            opacity: 1,
            fillOpacity: 0.8
        });
    }
});

将图层添加到地图实例中：

geoJsonLayer.addTo(map);

关于plunker的工作示例：http://plnkr.co/edit/RzYMrkkly3DdHMnkjvVN?p=preview

传阅小册子中的数据

1 个答案: