Leaflet:Circle的行为与CircleMarker不同

Question

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

但我需要Circles,因为我试图在地图上绘制100米半径的圆圈.为此,我使用以下代码:

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的中心点则无效.

我是否忽视了一些明显的东西,或者这只是Leaflet中的一个弱点和/或错误,我只需要解决这个问题？

Answer 1

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

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

和

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

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

Answer 2

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

该方法与circleMarker中的方法不同，因为它动态计算圆的半径。如果你改变有

this._mRadius/hLength

到

this._mRadius.radius/hLength

应该没问题。