[英]Google Maps API in Javascript, Draw the radius of a circle?
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.目前,我用 API 从我的地图中心画了一个圆圈。 I do not think it helps ...
我不认为它有帮助......
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)
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();
Reference : Here and also this could be useful.参考: 这里和这也可能有用。
The perfect thing for this is the computeOffset(from:LatLng, distance:number, heading:number, radius?:number)
function from the google.maps.geometry.spherical
namespace, as referenced in the documentation最完美的是来自
google.maps.geometry.spherical
命名空间的computeOffset(from:LatLng, distance:number, heading:number, radius?:number)
函数,如文档中所述
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)从那里开始,从圆的中心创建一条多段线,以自身的半径作为偏移量,您可以查看我在此处制作的快速示例(只需在地图周围单击即可查看它的工作情况)
I agree with @The Alpha我同意@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');
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.