我有以下地图,我想为城市的区域边界创建多条折线。有没有人有任何建议?
我正在试图弄清楚要做什么,但我遇到了问题。
<script type="text/javascript">
var locations = [
['Walk-In Clinic at 911 Yates Street, Victoria ',48.4255021,-123.3582085],
['Walk-In Clinic at 1105 Pandora Avenue, Victoria ',48.4266277,-123.3530197],
['Walk-In Clinic at 1640 Oak Bay Avenue, Victoria ',48.4266361,-123.3345531],
['Walk-In Clinic at 835 Langford Parkway, Victoria ',48.4414069,-123.5048409],
];
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 10,
center: new google.maps.LatLng(48.4255021, -123.3582085),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
if (GBrowserIsCompatible()) {
// === The basis of the arrow icon information ===
var arrowIcon = new GIcon();
arrowIcon.iconSize = new GSize(24,24);
arrowIcon.shadowSize = new GSize(1,1);
arrowIcon.iconAnchor = new GPoint(12,12);
arrowIcon.infoWindowAnchor = new GPoint(0,0);
// === Function to create a marker arrow ===
function createMarker(point,icon) {
var marker = new GMarker(point,icon);
map.addOverlay(marker)
}
// === Returns the bearing in degrees between two points. ===
// North = 0, East = 90, South = 180, West = 270.
var degreesPerRadian = 180.0 / Math.PI;
function bearing( from, to ) {
// See T. Vincenty, Survey Review, 23, No 176, p 88-93,1975.
// Convert to radians.
var lat1 = from.latRadians();
var lon1 = from.lngRadians();
var lat2 = to.latRadians();
var lon2 = to.lngRadians();
// Compute the angle.
var angle = - Math.atan2( Math.sin( lon1 - lon2 ) * Math.cos( lat2 ), Math.cos ( lat1 ) * Math.sin( lat2 ) - Math.sin( lat1 ) * Math.cos( lat2 ) * Math.cos( lon1 - lon2 ) );
if ( angle < 0.0 )
angle += Math.PI * 2.0;
// And convert result to degrees.
angle = angle * degreesPerRadian;
angle = angle.toFixed(1);
return angle;
}
// === A function to create the arrow head at the end of the polyline ===
// create the map
var map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(49.191352,-122.890491), 9);
// === The array of points for the polyline ===
var points = [ new GLatLng(49.191352,-122.890491), new GLatLng(49.090506,- 122.869377)];
// === Create the polyline
map.addOverlay(new GPolyline(points));
// === add the arrow head
// === Another one ===
var points = [new GLatLng(49.181268,-122.690377), new GLatLng(49.002299,-122.691168)];
map.addOverlay(new GPolyline(points));
// === this time with arrows on the midlines
}
else {
alert("Sorry, the Google Maps API is not compatible with this browser");
}
</script>
</body>
</html>