谷歌地图 3

API学习地址
其实google map的api很简单的，这里是学习文档的传送门http://code.google.com/intl/zh-CN/apis/maps/documentation/javascript/articles.html
代码的一些实例
可以国际化的google map
[html] view plaincopy
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false&language=语言-国家缩写">
</script>
在language后面写上语言国家缩写就可以国际化google map了
Map类
初始化地图的方法：
[javascript] view plaincopy
var myOptions = {
zoom : 11,
center : new google.maps.LatLng(30.1234567,120.3456789),
mapTypeId : google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("mainMapLayer"),myOptions);
1、center是指地图定位的坐标，需要LatLng对象，对象参数就是纬度和经度
2、mapTypeId是类似枚举的东西，详细参考api
3、mainMapLayer是我的地图div对象的id名，这个div要指明高度和宽度要不地图没法初始化
Marker类、InfoWindow类
添加自定义的marker：
[javascript] view plaincopy
var userMarker = new google.maps.Marker( {
position : new google.maps.LatLng(30,120),
map : map,
title : "鼠标悬浮时提示的信息",
icon : "图片位置字符串"
});
var yourInfoWindow;

(function(userMarker) {
google.maps.event.addListener(userMarker, 'click', function() {
if (!yourInfoWindow) {
yourInfoWindow = new google.maps.InfoWindow( {});
}
yourInfoWindow.setContent(userMarker.title);
yourInfoWindow.open(map, userMarker);
});
})(userMarker);
1、Marker类是为地图上添加类似小图钉似的提示位置用的东西
2、Marker需要设置坐标和地图对象来初始化
3、同一个Marker对象要重用时使用下面语句重新使用
[javascript] view plaincopy
userMarker.setMap(null);
4、最后是为marker对象添加点击事件，使用的是嵌套写法（用在for循环里更好使）
5、infowindow是弹出的那个大窗体，他的setContent方法是支持html和css代码的，可以放进去div或table设置样式
LatLngBounds类
Map范围自适应：
[javascript] view plaincopy
var bounds = new google.maps.LatLngBounds();
bounds.extend(new google.maps.LatLng(30,120));
//为新的结果创建marker
for ( var i in member) {
bounds.extend(new google.maps.LatLng(member[i][2],member[i][3]));
var marker = new google.maps.Marker( {
position : new google.maps.LatLng(member[i][2], member[i][3]),
map : map,
title : "title",
icon : "imageAddress"
});
markers.push(marker);
//为marker添加infowindow，添加点击事件
(function(i, marker) {
google.maps.event.addListener(
marker,
'click',
function() {
if (!infoawindow) {//单例infowindow
infoawindow = new google.maps.InfoWindow(
{});
}
infoawindow.open(map, marker);
});
})(i, marker);
}
map.fitBounds(bounds);//这句最重要
Geocoder类
提交地址字符串返回经纬度（很好用的功能），查询全靠它
[javascript] view plaincopy
var geocoder = new google.maps.Geocoder();
geocoder.geocode( {
'address' : "格式可以是不分割的：北京市东城区东直门，或北京市,东城区,东直门"
}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
myLatLng = results[0].geometry.location;
//results数组里有很多有用的信息，包括坐标和返回的标准位置信息
} else {
alert(interGeoAnalysisFailed);
}
});
地图导航服务
[javascript] view plaincopy
var map;    //地图对象
var mode = google.maps.DirectionsTravelMode.DRIVING;    //谷歌地图路线指引的模式
var directionsDisplay = new google.maps.DirectionsRenderer();   //地图路线显示对象
var directionsService = new google.maps.DirectionsService();    //地图路线服务对象
var directionsVisible = false;  //是否显示路线
directionsDisplay.setMap(null);
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById("directionsPanel")); //将路线导航结果显示到div中
var request = {origin: findLatLng, destination: marker.position, travelMode: mode, optimizeWaypoints: true, avoidHighways: false,avoidTolls: false};
directionsService.route
(
request,
function(response, status)
{
if (status == google.maps.DirectionsStatus.OK)
{
directionsDisplay.setDirections(response);
}
}
);
directionsVisible = true;