如何使用mapbox.js绘制具有指定半径值的标记周围的圆圈

How to draw circles around markers with the specified radius value using mapbox.js

本文关键字:周围 js mapbox 何使用 绘制      更新时间:2023-09-26

嗨,我想在圆圈的帮助下显示标记周围的数量值。基本上,如果圆圈较大,则意味着该位置的可用数量比小圆圈最大。我可以在地图上显示标记。但我正在尝试显示圆圈。圆的半径值在值变量中。我想根据地球的半径转换这个可用的量值,然后显示圆。

下面是代码片段

 // var map = L.mapbox.map('map', 'examples.map-i86nkdio')
            var map=L.mapbox.map('map','hexample.j1m1kko7')
        .setView([42.274260, -83.365717], 9);
            for (i = 0; i < lats.length; i++)
            {
                var marker = L.marker([lats[i], longs[i]], {
                    icon: L.mapbox.marker.icon({
                        'marker-color': '#E80000'
                    })
                })
                .bindPopup('<button class="trigger">' + FacName[i] + '</button>')
                .addTo(map);
                L.circleMarker([lats[i], longs[i]], value[i])
                .addTo(map);
            }

我可以使用折线或多边形来显示圆形,因为Circlemarker会创建标记

前几天我遇到了同样的问题,最后使用了像这样的L.circle

marker = L.circle(latlng, radius).addTo(map);

并在相同的横向位置放置常规标记。试试吧!

不幸的是,MapBox似乎已经更新了这个,至少它不适合我-所以也许其他人可能会发现这有帮助。

我必须使用L.circleMarker才能使它起作用。

的例子:

var circle = L.circleMarker([55.37911044801047, -2.8125], {radius: 100}).addTo(map);

更多文档在这里:https://www.mapbox.com/mapbox.js/api/v2.1.9/l-circlemarker/