<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>百度地图</title> <script type="text/javascript"> var iscreatr=false; function initialize() { //---------------------------------------------基础示例--------------------------------------------- var map = new BMap.Map("allmap",{minZoom:12,maxZoom:20}); // 创建Map实例 //map.centerAndZoom(new BMap.Point(116.4035,39.915),15); //初始化时,即可设置中心点和地图缩放级别。 map.centerAndZoom("成都",13); // 初始化地图,设置中心点坐标和地图级别。 map.enableScrollWheelZoom(true);//鼠标滑动轮子可以滚动 //---------------------------------------------信息窗口(地图上由此只有1个)--------------------------------------------- var sContent = "<h4 style='margin:0 0 5px 0;padding:0.2em 0'>哈哈门</h4>" + "<img style='float:right;margin:4px' id='imgDemo' src='http://avatar.csdn.net/4/7/8/1_sd0902.jpg' width='139' height='104' title='哈哈门'/>" + "<p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>哈哈门坐落在中国北京市中心,故宫的南侧,与哈哈门广场隔长安街相望,是清朝皇城的大门...</p>" + "</div>"; var point = new BMap.Point(104.017287, 30.685906);//默认 var infoWindow = new BMap.InfoWindow(sContent); // 创建信息窗口对象 map.openInfoWindow(infoWindow,point); //---------------------------------------------创建标注--------------------------------------------- var point = new BMap.Point(104.117287, 30.685906);//默认 // 创建标注对象并添加到地图 var marker = new BMap.Marker(point); map.addOverlay(marker); //---------------------------------------------点击标注弹出信息窗口--------------------------------------------- var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>哈哈,你看见我啦!我可不常出现哦!</p><p style='font-size:14px;'>看看我是如何添加上来的!</p>"); marker.addEventListener("click", function(e){ this.openInfoWindow(infoWindow); }); } function loadScript() { var script = document.createElement("script"); script.src = "http://api.map.baidu.com/api?v=1.4&callback=initialize"; document.body.appendChild(script); } window.onload = loadScript; </script> </head> <body> <div id="r-result" style="float:left;width:100px;">打印坐标</div> <div id="allmap" style="width: 800px; height: 500px"></div> </body> </html> <script type="text/javascript"> // 移动到某点 map.panTo(new BMap.Point(116.409, 39.918)); // map.setZoom(14); //放到到14级 </script>
?