相关疑难解决方法(0)

使用Mapbox GL JS绘制半径为英里/米的圆

我正在将地图从使用mapbox.js转换为mapbox-gl.js,并且无法绘制使用英里或米的半径而不是像素的圆圈.该特定圆圈用于显示从中心点到任何方向的距离区域.

以前我可以使用以下内容,然后将其添加到图层组:

// 500 miles = 804672 meters
L.circle(L.latLng(41.0804, -85.1392), 804672, {
    stroke: false,
    fill: true,
    fillOpacity: 0.6,
    fillColor: "#5b94c6",
    className: "circle_500"
});
Run Code Online (Sandbox Code Playgroud)

我在Mapbox GL中发现的唯一文档如下:

map.addSource("source_circle_500", {
    "type": "geojson",
    "data": {
        "type": "FeatureCollection",
        "features": [{
            "type": "Feature",
            "geometry": {
                "type": "Point",
                "coordinates": [-85.1392, 41.0804]
            }
        }]
    }
});

map.addLayer({
    "id": "circle500",
    "type": "circle",
    "source": "source_circle_500",
    "layout": {
        "visibility": "none"
    },
    "paint": {
        "circle-radius": 804672,
        "circle-color": "#5b94c6",
        "circle-opacity": 0.6
    }
});
Run Code Online (Sandbox Code Playgroud)

但是这会以像素为单位呈现圆形,但不会缩放.目前是否有一种方法可以让Mapbox GL渲染一个带有圆(或多个)的图层,该图层基于距离和缩放比例?

我目前正在使用Mapbox GL的v0.19.0.

mapbox-gl-js

26
推荐指数
6
解决办法
2万
查看次数

标签 统计

mapbox-gl-js ×1