google maps v3 drawing circle using haversine formula and polyline
I am drawing a circle on a map using the haversine formula and google.maps.Polyline. There is an error in my code that is causing the circle to be drawn with a line through it. What is the error that is causing this and how can I correct it? (I need to draw my circle using a Polyline so that I can use the points of the circle to determine if given locations are inside the circle. Therefore, I am not using google.maps.Circle)
see code below:
var address=document.getElementById("address").value;
var radius=document.getElementById("radius").value;
var latitude=40;
var longitude=0;
geocoder.geocode( { 'address': address}, function(results, status){
if (status==google.maps.GeocoderStatus.OK){
latlng=(results[0].geometry.location);
latitude=latlng.lat();
longitude=latlng.lng();
}
else{
alert("Geocode was not successful for the following reason: " + status);
}
});
//Degrees to radians
var d2r = Math.PI / 180;
/开发者_运维技巧/ Radians to degrees
var r2d = 180 / Math.PI;
// Earth radius is 3,963 miles
var cLat = (radius / 3963) * r2d;
var cLng = cLat / Math.cos(latitude * d2r);
//Store points in array
var points = [];
alert("declare array");
var bounds= new google.maps.LatLngBounds();
// Calculate the points
// Work around 360 points on circle
for (var i=0; i < 360; i++) {
var theta = Math.PI * (i/16);
// Calculate next X point
circleY = longitude + (cLng * Math.cos(theta));
// Calculate next Y point
circleX = latitude + (cLat * Math.sin(theta));
// Add point to array
var aPoint=new google.maps.LatLng(circleX, circleY);
points.push(aPoint);
bounds.extend(aPoint);
}
points.push(points[0]);//to complete circle
var colors=["#CD0000","#2E6444","#003F87" ];
var Polyline_Path = new google.maps.Polyline({
path: points,
strokeColor: colors[count],
// color of the outline of the polygon
strokeOpacity: 1,
// between 0.0 and 1.0
strokeWeight: 1,
// The stroke width in pixels
fillColor: colors[count],
fillOpacity: 0
});
Polyline_Path.setMap(map);
Your value for theta in the loop needs to go from 0 to 2*PI to create a whole circle. Your value is going from 0 to 22.5*PI. This means you are going round the circle 10.25 times, and end up drawing a line from a quarter way round the circle to the point where you started: this is the line you are talking about.
Try using :
var theta = Math.PI * (i / 180);
Although you may also want to cut down the number of points: 360 segments is a lot for a circle. I have found 32 is usually more than enough.
The answer above is correct, but you say you can't use the circle from the API because you want to do a point in polygon check. You should use the Circle class and do a distance check to know if the point is in the circle. You can use your implementation of distance or use the API (google.maps.geometry.spherical.computeDistanceBetween).
精彩评论