javascript - map 中的圆圈(大小可缩放)

Question

我用带有一个圆圈的 Leaflet 制作 map 。 索引代码:

<div id="mapid" style="height: 500px;"></div>

        <script type="text/javascript">

            var mymap = L.map('mapid').setView([52.233333, 19.016667], 6);

                L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                            attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
                            minZoom: 6,
                }).addTo(mymap);

                var x = 52.233333;
                var y = 19.016667;

                    showCircle(x,y);
        </script>                               

圈子:

function showCircle(x,y)
{
    var circle = L.circle([x,y], 1900, {
        color: 'blue',
        fillColor: '#f03',
        fillOpacity: 0.5
    }).addTo(mymap);
}

问题是:圆总是有相同的大小。 我想得到:如果我缩小 map ，圆圈更大，当我放大时，圆圈更小。 (zoomin，zoomout 来自滚动)

如何得到这个效果？

Answer 1

Leaflet 中有两种圆:L.Circle 和L.CircleMarker。 L.Circle has a radius specified in meters , 和 L.CircleMarker has a radius specified in pixels .

您的问题不是很清楚(“始终具有相同的大小”是什么意思？米还是像素？)；但我猜您想使用 L.CircleMarker 而不是 L.Circle。