javascript Javascript中的Google Maps API，绘制圆的半径？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12231725/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Google Maps API in Javascript, Draw the radius of a circle?
提问by The Alpha
I am looking for a way to draw the radius of the circle or a line from the center of the circle to the edge of the circle (at a precise coordinate in degrees).
我正在寻找一种方法来绘制圆的半径或从圆心到圆边缘的线（以度为单位的精确坐标）。
Is it possible? How?
是否可以？如何？
Currently, I drew a circle with the API from the center of my map. I do not think it helps ...
目前，我用 API 从我的地图中心画了一个圆圈。我不认为它有帮助......
Example of what I would : http://twitpic.com/aq40vv
我会做的例子：http: //twitpic.com/aq40vv
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)
采纳答案by lccarrasco
The perfect thing for this is the computeOffset(from:LatLng, distance:number, heading:number, radius?:number)function from the google.maps.geometry.sphericalnamespace, as referenced in the documentation
最完美的是命名空间中的computeOffset(from:LatLng, distance:number, heading:number, radius?:number)函数google.maps.geometry.spherical，如文档中所述
From there on just create a polyline from the center of the circle with the radius of itself as the offset, you can check a quick example I made here(just click around the map to see it working)
从那里开始，从圆心创建一条多段线，以自身的半径作为偏移量，您可以查看我在此处制作的快速示例（只需在地图上单击即可查看它的工作情况）
回答by The Alpha
Try this (Not sure if this is what you asked for)
试试这个（不确定这是否是你要求的）
HTML:
HTML：
<div id="map_canvas"></div>?
JS:
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.
演示。
