- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
- <style type="text/CSS">
- body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"Microsoft Yahei";}
- </style>
- <script type="text/javascript" src1="http://api.map.baidu.com/api?v=2.0&ak=3bb801b79151585f9534ed9ed7ff280d"></script>
- <title>BaiduMap</title>
- </head>
- <body>
- <div id="showbd"
- style="position: absolute;
- margin-top:1px;
- width: 800px;
- height: 600px;
- top: 10;
- border: 1px solid gray;
- overflow:hidden;">
- </div>
- </body>
- </html>
- <script type="text/javascript">
- // 百度地图API功能
- var map = new BMap.Map("showbd");
- map.enableScrollWheelZoom(); //启用滚轮放大缩小,默认禁用
- map.enableContinuousZoom(); //启用地图惯性拖拽,默认禁用
- map.addControl(new BMap.NavigationControl()); //初始化地图控件
- map.addControl(new BMap.ScaleControl());
- map.addControl(new BMap.OverviewMapControl());
- var point=new BMap.Point(114.294672,30.555526);
- map.centerAndZoom(point, 11);//初始化地图中心点
- var marker = new BMap.Marker(point); //初始化地图标记
- var json_data = [[114.401,30.915],[114.402,30.915],[114.403,30.915]];
- var pointArray = new Array();
- for(var i=0;i<json_data.length;i++){
- var marker = new BMap.Marker(new BMap.Point(json_data[i][0], json_data[i][1])); // 创建点
- map.addOverlay(marker); //增加点
- var label = new BMap.Label("标注"+i,{offset:new BMap.Size(20,-10)});
- label.setStyle({
- display:"none",
- });
- marker.setLabel(label);
- pointArray[i] = new BMap.Point(json_data[i][0], json_data[i][1]);
- marker.addEventListener("click",attribute);
- marker.addEventListener("mouseover", function(e){
- var p = e.target.getLabel();
- p.setStyle({ display:"block"});
- });
- marker.addEventListener("mouseout", function(e){
- var p = e.target.getLabel();
- p.setStyle({display:"none"});
- });
- }
- //让所有点在视野范围内
- map.setViewport(pointArray);
- //获取覆盖物位置
- function attribute(e){
- var p = e.target;
- alert("marker的位置是" + p.getPosition().lng + "," + p.getPosition().lat);
- }
- </script>
- //该片段来自于http://www.codesnippet.cn/detail/2511201514079.html
来源: http://www.codesnippet.cn/detail/2511201514079.html