网址:
http://my.oschina.net/u/146658/blog/36327
http://blog.csdn.net/del1214/article/details/6768605
1.注册google map获取key
http://code.google.com/intl/zh-CN/apis/maps/signup.html
android:http://code.google.com/intl/zh-CN/android/maps-api-signup.html
api:
http://code.google.com/intl/zh-CN/apis/maps/documentation/javascript/basics.html#Welcome
http://code.google.com/intl/zh-CN/apis/maps/documentation/javascript/tutorial.html#api_key
地图事件
http://code.google.com/intl/zh-CN/apis/maps/documentation/javascript/reference.html
api v3
根据地址获取坐标
var geocoder = new google.maps.Geocoder();
geocoder.geocode( {
'address' : "成都市东大街下东大街段216号喜年广场B座"
}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
myLatLng = results[0].geometry.location;
//results数组里有很多有用的信息,包括坐标和返回的标准位置信息
alert(myLatLng);
} else {
alert('123');
}
return false;
});
一个简单的实例
引入js,有语言控制的话js后面加上&lang=en等
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
var lat = '<?php echo $brand->latitude; ?>';//纬度
var lng = '<?php echo $brand->longitude; ?>';//经度
var language = '<?php echo $lang; ?>';
if( language == 'zh' ){
//标注点数组
var markerArr = [{title:"银杏南亭",content:"成都市人民南路四段十九号威斯顿联邦大厦1~6楼",point:"30.624845|104.0670590",isOpen:0,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
,{title:"银杏金阁",content:"成都市锦里中路2号",point:"30.649664|104.056942",isOpen:0,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
,{title:"银杏川菜",content:"成都市临江中路12号",point:"30.645281|104.071240",isOpen:0,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
,{title:"银杏春天",content:"成都市二环路西二段19号春天广场A座1-2楼",point:"30.664287|104.021352",isOpen:0,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
,{title:"银杏东禧",content:"成都市东大街下东大街段216号喜年广场B座1、3楼",point:"30.648772|104.086188",isOpen:0,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
];
}else{
//标注点数组
var markerArr = [{title:"GINGKO NANTING",content:"成都市人民南路四段十九号威斯顿联邦大厦1~6楼",point:"30.624845|104.0670590",isOpen:0,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
,{title:"GINGKO JINGE",content:"成都市锦里中路2号",point:"30.649664|104.056942",isOpen:0,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
,{title:"GINGKO SICHUAN",content:"成都市临江中路12号",point:"30.645281|104.071240",isOpen:0,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
,{title:"GINGKO SPRING",content:"成都市二环路西二段19号春天广场A座1-2楼",point:"30.664287|104.021352",isOpen:0,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
,{title:"GINGKO DONGXI",content:"成都市东大街下东大街段216号喜年广场B座1、3楼",point:"30.648772|104.086188",isOpen:0,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
];
}
var myLatLng;
var map;
function initialize(lat, lng){
myLatLng = new google.maps.LatLng(lat, lng);
var myOptions = {
zoom: 12,
maxZoom: 16,
minZoom: 8,
zoomControlOptions: {position:google.maps.ControlPosition.TOP_LEFT,style:google.maps.ZoomControlStyle.LARGE},
center: myLatLng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('dituContent'), myOptions);
addMarker();
}
//添加marker
function addMarker(){
for( var i = 0; i < markerArr.length; i++ ){
var jsonData = markerArr[i];
var marker = createMarker(jsonData);
}
}
//创建marker
function createMarker(jsonData){
var mlat = jsonData.point.split("|")[0];
var mlng = jsonData.point.split("|")[1];
var latLng = new google.maps.LatLng(mlat, mlng);
var marker = new google.maps.Marker({
position: latLng,
map: map
});
var infowindow = new google.maps.InfoWindow({content: "<b class='iw_poi_title' title='" + jsonData.title + "'>" + jsonData.title + "</b><div class='iw_poi_content'>"+jsonData.content+"</div>"});
google.maps.event.addListener(marker, 'mouseover', function () {
infowindow.open(map, marker);
});
google.maps.event.addListener(marker, 'mouseout', function () {
infowindow.close();
});
return marker;
}
initialize(lat, lng);