Question

我正在寻找一种方法来绘制圆的半径或从圆的中心到圆的边缘的一条线（精确的坐标，以度为单位）。

有可能吗？怎么样？

目前，我从地图中心画了一个带有API的圆圈。我认为这没有帮助...

var sunCircle = {
          strokeColor: "#c3fc49",
          strokeOpacity: 0.8,
          strokeWeight: 2,
          fillColor: "#c3fc49",
          fillOpacity: 0.35,
          map: map,
          center: latlng,
          radius: 1500
        };
        cityCircle = new google.maps.Circle(sunCircle)

Answer 1

试试这个（不确定这是否是你要求的）

<强> HTML：

<div id="map_canvas"></div>

<强> JS：

var map;
var latlng = new google.maps.LatLng(-34.397, 150.644);
function initialize() {
    var mapOptions = {
        center: latlng,
        zoom: 9,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var el=document.getElementById("map_canvas");
    map = new google.maps.Map(el, mapOptions);

    var marker = new google.maps.Marker({
        map: map,
        position: latlng
    });

    var sunCircle = {
        strokeColor: "#c3fc49",
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: "#c3fc49",
        fillOpacity: 0.35,
        map: map,
        center: latlng,
        radius: 15000 // in meters
    };
    cityCircle = new google.maps.Circle(sunCircle)
    cityCircle.bindTo('center', marker, 'position');
}
initialize();

DEMO

参考： Here以及this可能很有用。

Answer 2

最理想的是来自computeOffset(from:LatLng, distance:number, heading:number, radius?:number)命名空间的google.maps.geometry.spherical函数，如documentation

中所引用

从那里开始，只需从圆心开始创建一条折线，其半径为偏移，你可以查看我做的一个快速示例here（只需点击地图即可看到它的工作情况）< / p>

Answer 3

我同意@The Alpha

        // The marker
        var marker = new google.maps.Marker({
            position: startLatLng,
            map: map,
            icon: './img/marker.png'
        });

        var circle = {
            center: startLatLng,
            map: map,
            strokeColor: "#F26836",
            strokeOpacity: 0.2,
            strokeWeight: 2,
            fillColor: "#322F6A",
            fillOpacity: 0.2,
            radius: 50 // in meters
        };

        mapCircle = new google.maps.Circle(circle)
        mapCircle.bindTo('center', marker, 'position');

Javascript中的Google Maps API，绘制圆的半径？

3 个答案: