??!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="~v?0W?,~v?0W?API ?~v?0W???[IN?wQ ?~v?0W?@b?sS@b?_?wQ" /> <meta name="description" content="~v?0W?API??[IN0W? ?.^?(u7b(W??S?\O Nub~v?0W?" /> <title>~v?0W?API??[IN0W?</title> <!--_(u~v?0W?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> <!--~v?0W??hV--> <div style="width:100%;height:550px;border:#ccc solid 1px;" id="dituContent"></div> </body> <script type="text/javascript"> //R??TR?S0W??pe? function initMap(){ createMap();//R?0W? setMapEvent();//?n0W??N? addMapControl();//T0W???R?? addMarker();//T0W?-N??Rmarker } //R?0W??pe? function createMap(){ var map = new BMap.Map("dituContent");//(W~v?0W??hV-NR?N*N0W? var point = new BMap.Point(124.374513,40.12291);//?[INN*N-N??PWh map.centerAndZoom(point,18);//??[0W??v-N???TPWhv^\0W?>f:y(W0W??hV-N window.map = map;//\map??X[?(WhQ@\ } //0W??N??n?pe? function setMapEvent(){ map.enableDragging();///T(u0W????N? ???/T(u(? N?Q) map.enableScrollWheelZoom();///T(u0W??n?>e'Y)\ map.enableDoubleClickZoom();///T(u ?h??>e'Y ???/T(u(? N?Q) map.enableKeyboard();///T(u.?? N N??.???0W? } //0W?????R?pe? function addMapControl(){ //T0W?-N??R)>e?? var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE}); map.addControl(ctrl_nav); //T0W?-N??R)eu??? var ctrl_ove = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:1}); map.addControl(ctrl_ove); //T0W?-N??R??O:\?? var ctrl_sca = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT}); map.addControl(ctrl_sca); } //h??pe? var markerArr = [{title:"璨俪晾D?nbsp;俪%?nbsp;$??nbsp; ??nbsp;醅?",content:"???&nbsp;谈U??nbsp;璨&nbsp;俪苈&nbsp;纳e?nbsp;l?nbsp;纳&nbsp;?nbsp;?nbsp;56&nbsp;-&nbsp;5<br/>??&nbsp;0415&nbsp;-&nbsp;3105356;&nbsp;3105358<br/>捌赣???&nbsp;118000<br/>H??抢?www.lnsc.cn<br/>T?nbsp;|屈?nbsp;??lnsc@163.com",point:"124.374589|40.123",isOpen:1,icon:{w:21,h:21,l:0,t:0,x:6,lb:5}} ]; //R?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); } })() } } //R?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; } //R?N*NIcon function createIcon(json){ var icon = new BMap.Icon(" http://api.map.baidu.com/lbsapi/creatmap/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();//R??TR?S0W? </script> </html>