<!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=gb2312" / >
< meta name = "keywords" content = "<EFBFBD> ٶȵ<EFBFBD> ͼ,<EFBFBD> ٶȵ<EFBFBD> ͼAPI<EFBFBD> <EFBFBD> <EFBFBD> ٶȵ<EFBFBD> ͼ<EFBFBD> Զ<EFBFBD> <EFBFBD> 幤<EFBFBD> ߣ<EFBFBD> <EFBFBD> ٶȵ<EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ù<EFBFBD> <EFBFBD> <EFBFBD> " / >
< meta name = "description" content = "<EFBFBD> ٶȵ<EFBFBD> ͼAPI<EFBFBD> Զ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> û<EFBFBD> <EFBFBD> ڿ<EFBFBD> <EFBFBD> ӻ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ɰٶȵ<EFBFBD> ͼ" / >
< title > <EFBFBD> ٶȵ<EFBFBD> ͼAPI<EFBFBD> Զ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ< / title >
<!-- <EFBFBD> <EFBFBD> <EFBFBD> ðٶȵ<EFBFBD> ͼAPI-->
< style type = "text/css" >
html,body{margin:0;padding:0;}
.iw_poi_title {color:#CC5522;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space:nowrap}
.iw_poi_content {font:12px arial,sans-serif;overflow:visible;padding-top:4px;white-space:-moz-pre-wrap;word-wrap:break-word}
< / style >
< script type = "text/javascript" src = "http://api.map.baidu.com/api?key=&v=1.1&services=true" > < / script >
< / head >
< body >
<!-- <EFBFBD> ٶȵ<EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> -->
< div style = "width:957px;height:550px;border:#ccc solid 1px;" id = "dituContent" > < / div >
< / body >
< script type = "text/javascript" >
//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͳ<EFBFBD> ʼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD>
function initMap(){
createMap();//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ
setMapEvent();//<EFBFBD> <EFBFBD> <EFBFBD> õ<EFBFBD> ͼ<EFBFBD> ¼<EFBFBD>
addMapControl();//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> ӿؼ<EFBFBD>
addMarker();//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> marker
}
//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD>
function createMap(){
var map = new BMap.Map("dituContent");//<EFBFBD> ڰٶȵ<EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> д<EFBFBD> <EFBFBD> <EFBFBD> һ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ
var point = new BMap.Point(116.256224,39.862932);//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> һ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ĵ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD>
map.centerAndZoom(point,18);//<EFBFBD> 趨<EFBFBD> <EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ĵ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> 겢<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ<EFBFBD> <EFBFBD> ʾ<EFBFBD> ڵ<EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD>
window.map = map;//<EFBFBD> <EFBFBD> map<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> 洢<EFBFBD> <EFBFBD> ȫ<EFBFBD> <EFBFBD>
}
//<EFBFBD> <EFBFBD> ͼ<EFBFBD> ¼<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ú<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD>
function setMapEvent(){
map.enableDragging();//<EFBFBD> <EFBFBD> <EFBFBD> õ<EFBFBD> ͼ<EFBFBD> <EFBFBD> ק<EFBFBD> ¼<EFBFBD> <EFBFBD> <EFBFBD> Ĭ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> (<EFBFBD> ɲ<EFBFBD> д)
map.enableScrollWheelZoom();//<EFBFBD> <EFBFBD> <EFBFBD> õ<EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> ַ <EFBFBD> <EFBFBD> <EFBFBD> С
map.enableDoubleClickZoom();//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ˫<EFBFBD> <EFBFBD> <EFBFBD> Ŵ<EFBFBD> <EFBFBD> <EFBFBD> Ĭ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> (<EFBFBD> ɲ<EFBFBD> д)
map.enableKeyboard();//<EFBFBD> <EFBFBD> <EFBFBD> ü<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> Ҽ<EFBFBD> <EFBFBD> ƶ<EFBFBD> <EFBFBD> <EFBFBD> ͼ
}
//<EFBFBD> <EFBFBD> ͼ<EFBFBD> ؼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> Ӻ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD>
function addMapControl(){
//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ſؼ<EFBFBD>
var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_ZOOM});
map.addControl(ctrl_nav);
//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ<EFBFBD> ؼ<EFBFBD>
var ctrl_ove = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:0});
map.addControl(ctrl_ove);
//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ӱ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ߿ؼ<EFBFBD>
var ctrl_sca = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
map.addControl(ctrl_sca);
}
//<EFBFBD> <EFBFBD> ע<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD>
var markerArr = [{title:"<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ӯ<EFBFBD> <EFBFBD> ˳<EFBFBD> Ƽ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ˾",content:"<EFBFBD> <EFBFBD> ַ <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ̨ <EFBFBD> <EFBFBD> ¬<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ·<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> 59<EFBFBD> <EFBFBD> < br / > <EFBFBD> 绰<EFBFBD> <EFBFBD> (010)8329 8300",point:"116.256138|39.862981",isOpen:1,icon:{w:23,h:25,l:0,t:21,x:9,lb:12}}
];
//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> marker
function addMarker(){
for(var i=0;i< markerArr.length ; i + + ) {
var json = markerArr[i];
var p0 = json.point.split("|")[0];
var p1 = json.point.split("|")[1];
var point = new BMap.Point(p0,p1);
var iconImg = createIcon(json.icon);
var marker = new BMap.Marker(point,{icon:iconImg});
var iw = createInfoWindow(i);
var label = new BMap.Label(json.title,{"offset":new BMap.Size(json.icon.lb-json.icon.x+10,-20)});
marker.setLabel(label);
map.addOverlay(marker);
label.setStyle({
borderColor:"#808080",
color:"#333",
cursor:"pointer"
});
(function(){
var index = i;
var _iw = createInfoWindow(i);
var _marker = marker;
_marker.addEventListener("click",function(){
this.openInfoWindow(_iw);
});
_iw.addEventListener("open",function(){
_marker.getLabel().hide();
})
_iw.addEventListener("close",function(){
_marker.getLabel().show();
})
label.addEventListener("click",function(){
_marker.openInfoWindow(_iw);
})
if(!!json.isOpen){
label.hide();
_marker.openInfoWindow(_iw);
}
})()
}
}
//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> InfoWindow
function createInfoWindow(i){
var json = markerArr[i];
var iw = new BMap.InfoWindow("< b class = 'iw_poi_title' title = '" + json.title + "' > " + json.title + "< / b > < div class = 'iw_poi_content' > "+json.content+"< / div > ");
return iw;
}
//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> һ<EFBFBD> <EFBFBD> Icon
function createIcon(json){
var icon = new BMap.Icon("http://app.baidu.com/map/images/us_mk_icon.png", new BMap.Size(json.w,json.h),{imageOffset: new BMap.Size(-json.l,-json.t),infoWindowOffset:new BMap.Size(json.lb+5,1),offset:new BMap.Size(json.x,json.h)})
return icon;
}
initMap();//<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͳ<EFBFBD> ʼ<EFBFBD> <EFBFBD> <EFBFBD> <EFBFBD> ͼ
< / script >
< / html >
