由于网上操作google地图大多是google地图的第一版，而且已经快要停用，对于新版的google地图大家由不太懂得，本人就整理了一些google地图的操作代码，分为给地图加标注和路标，移动标注，获得标注的坐标，把地址变成坐标，还有路径地图。
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<meta http-equiv=”X-UA-Compatible” content=”IE=7″ />
<body>
<input name=”data[company][address]” id=”data[company][address]” value=”北京市朝阳区团结湖北路2号” type=”text” style=”width:376px;” />
<DIV id=”map_canvas” style=”width:650px;height:400px;border:1px solid #dadada;”></DIV>
<p><input name=”data[company][address_pass]” value=”北京市朝阳区团结湖北路2号” id=”data[company][address_pass]” type=”text” style=”width:376px;” /><input type=”button” value=”定位” onclick=”address()”></p>
<script src=”http://ditu.google.cn/maps/api/js?sensor=false&language=zh-cn” type=”text/javascript” charset=”utf-8″></script>
<script type=”text/javascript”>
var geocoder;
var map;
var query = document.getElementById(“data[company][address]”).value;
if(query==””){
query=”北京”;
}
if(document.getElementById(‘data[company][address_pass]’).value!=””){
query = document.getElementById(‘data[company][address_pass]’).value;
}
//var display = “”;
initialize();
function initialize() {
geocoder = new google.maps.Geocoder();
var myOptions = {
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById(“map_canvas”), myOptions);
codeAddress();
setPaths(map);
}
function address(){
query = document.getElementById(‘data[company][address_pass]’).value;
geocoder = new google.maps.Geocoder();
var myOptions = {
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById(“map_canvas”), myOptions);
codeAddress();
}
function codeAddress() {
var address = query;
geocoder.geocode( { ‘address’: address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
//alert(results[0].geometry.location);
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({map: map,draggable:true,position: results[0].geometry.location});
google.maps.event.addListener(marker,’dragend’,function(){
var latlng = marker.getPosition();
zuobiao = latlng.lat()+”,”+latlng.lng();
document.getElementById(‘data[company][address_pass]’).value=zuobiao;
});
var infowindow = new google.maps.InfoWindow({
content:”<b>地址：</b>”+address+”<br>”+display
});
infowindow.open(map, marker);
} else {
alert(“未能解析该地址的原因: ” + status);
}
});
}
function setPaths(map) {
var trackPoints = [
new google.maps.LatLng(39.964556,116.274834),
new google.maps.LatLng(39.956662,116.275735),
new google.maps.LatLng(39.957221,116.284447),
new google.maps.LatLng(39.95834,116.29406),
new google.maps.LatLng(39.959326,116.29951),
new google.maps.LatLng(39.960083,116.303029),
new google.maps.LatLng(39.96209,116.307793),
new google.maps.LatLng(39.96366886044951,116.3119987037353),
new google.maps.LatLng(39.96699092690777,116.32122550274653),
new google.maps.LatLng(39.9695892624161,116.43538031842035),
new google.maps.LatLng(39.96853678398387,116.43829856182856),
new google.maps.LatLng(39.9528792540745,116.46125827099604),
new google.maps.LatLng(39.9515962303186,116.4617732551269),
new google.maps.LatLng(39.86834570158752,116.4608720328979),
new google.maps.LatLng(39.86692933748617,116.4597562339477),
new google.maps.LatLng(39.862745951862415,116.45447764660639),
new google.maps.LatLng(39.8422206097695,116.47829566265864),
new google.maps.LatLng(39.84574626557447,116.48305926586909),
new google.maps.LatLng(39.84890931670414,116.48499045635981),
new google.maps.LatLng(39.87615164874851,116.4895823981933),
new google.maps.LatLng(39.915563047663255,116.48983989025873),
new google.maps.LatLng(39.91569471024878,116.49580512310785),
new google.maps.LatLng(39.91994069292223,116.49597678448481),
new google.maps.LatLng(39.91994069292223,116.494388916748),
new google.maps.LatLng(39.92293576265125,116.49434600140375),
new google.maps.LatLng(39.92415350079288,116.49335894848627)
];
var spotPath = new google.maps.Polyline({
path: trackPoints,
strokeColor: “#ec4e89”,
strokeOpacity: 1.0,
strokeWeight: 6,
geodesic: true
});
spotPath.setMap(map);
}
</script>
</body>
</html>
代码是完整代码，你可以直接复制写到html文件里运行。