Circle in map (size scalable)

Question

I make map using Leaflet with one circle. index code:

<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>                               

ShowCircle :

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

The problem is : the circle always have the same size. I want to get: if i zoomout map the circle is bigger, when i zoomin the circle is smaller. (zoomin, zoomout is from scroll)

How to get this effect?

Answer 1

There are two kinds of circles in Leaflet: L.Circle and L.CircleMarker. L.Circle has a radius specified in meters, and L.CircleMarker has a radius specified in pixels.

Your question is not fully clear (what do you mean by "always have the same size"? Meters or pixels?); but I guess that you want to use L.CircleMarker instead of L.Circle.