7

在此处的 Leaflet 文档中:http ://leafletjs.com/reference-1.2.0.html#circlemarker 它说 CircleMaker 扩展了 Circle,并且它是同一件事,除了半径以像素而不是米为单位指定,这样即使您缩放地图,圆圈的大小也会保持不变。

但是我确实需要 Circles,因为我正在尝试在地图上绘制 100m 半径的圆圈。为此,我使用以下代码:

var geojsonLayer = new L.GeoJSON(null,{
pointToLayer: function (latlng){
    return new L.CircleMarker(latlng, {
        radius: 5,
        fillColor: "#ff7800",
        color: "#000",
        weight: 1,
        opacity: 1,
        fillOpacity: 0.8,
    });
}});

map.addLayer(osm);
map.addLayer(geojsonLayer);
geojsonLayer.addGeoJSON(jsonExample);

但是,如果我将代码更改为使用“Circle”而不是 CircleMaker,这将完美地工作,整个地图将无法加载,并且我收到一个 javascript 错误:

Error: Error: Invalid LatLng object: (56.229917, NaN)

我可以通过预先过滤geojson来删除那些既缺乏纬度又缺乏经度的点来解决这个问题,但我很困惑:Circle和CircleMaker都指定它们将LatLng对象作为中心点的规范,我不'不知道某个 LatLng 对象如何作为 CircleMarker 的中心点有效,但如果用作 Circle 的中心点则无效。

我是否忽略了一些明显的东西,或者这只是传单中的一个弱点和/或错误,我只需要解决?

4

3 回答 3

4

我通过更改 L.circle 中的 leaflet.js 的 _getLngRadius() 方法解决了这个问题。在传单版本 0.4.4 中,它在第 4913 行附近。

此方法与 circleMarker 中的方法不同,因为它动态计算圆的半径。如果您更改具有

this._mRadius/hLength

this._mRadius.radius/hLength

应该没问题。

于 2012-10-11T13:27:03.377 回答
4

代码没有问题了。尽管由于不同的构造函数很容易出现同样的问题:

L.CircleMarker( <LatLng> latlng, <Path options> options? )

L.Circle( <LatLng> latlng, <Number> radius, <Path options> options? )

请务必将半径传递给您的新圈子。

于 2013-06-24T13:12:15.033 回答
1

您可以在函数开头添加 if(latlng && latlng.lat && latlng.lng) (latlng)

这将忽略错误的数据。

于 2012-09-10T11:27:29.003 回答