微信

百度地图自己添加 标识地点 代码

<!DOCTYPE html>
<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 {width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}
        #allmap{width:100%;height:500px;}
        p{margin-left:5px; font-size:14px;}
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=eniNDkjbZhqB4Ro7MkEO15p3"></script>
    <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
    <title>给多个点添加信息窗口</title>
</head>
<body>
    <div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
    // 百度地图API功能    
    map = new BMap.Map("allmap");
    map.centerAndZoom(new BMap.Point(108.707509,34.345373), 15);
    map.enableScrollWheelZoom(true);
    map.disableDragging();     //禁止拖拽
    setTimeout(function(){
       map.enableDragging();   //两秒后开启拖拽
       //map.enableInertialDragging();   //两秒后开启惯性拖拽
    }, 2000);
    var data_info = [
                     [108.706808,34.374272,"地址:北京市东城区王府井大街88号乐天银泰百货八层"],
                     [108.702128,34.374119,"地址:北京市东城区东华门大街"],
                     [108.701562,34.372056,"地址:北京市东城区正义路甲5号"],
                     [108.70997,34.374395,"地址:111111111111"]
                    ];
    var opts = {
                width : 250,     // 信息窗口宽度
                height: 80,     // 信息窗口高度
                title : "信息窗口" , // 信息窗口标题
                enableMessage:true//设置允许信息窗发送短息
               };
    for(var i=0;i<data_info.length;i++){
        var marker = new BMap.Marker(new BMap.Point(data_info[i][0],data_info[i][1]));  // 创建标注
        var content = data_info[i][2];
        map.addOverlay(marker);               // 将标注添加到地图中
        addClickHandler(content,marker);
    }
    function addClickHandler(content,marker){
        marker.addEventListener("click",function(e){
            openInfo(content,e)}
        );
    }
    function openInfo(content,e){
        var p = e.target;
        var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
        var infoWindow = new BMap.InfoWindow(content,opts);  // 创建信息窗口对象 
        map.openInfoWindow(infoWindow,point); //开启信息窗口
    }
</script>

 

原文地址:http://www.cnblogs.com/xinlinux/p/4398667.html

posted @ 2015-04-07 16:34  Admin_info  阅读(932)  评论(0编辑  收藏  举报
青春时代是一个短暂的美梦,当你醒来时,这早已消失得无影无踪了。
点点Admin_info