百度地图如何同时添加多个标记？？？

qingYun1029 2012-06-06 02:03:03

做了一个socket程序来获取gps数据。。。

想通过百度地图将这些点（经纬度）标记上去。。。

问题来了，百度的经纬度和gps经纬度是不一样的，gps经纬度需要通过转换才能在百度上正确显示出来。。。

上代码：



<script type="text/javascript" src="js/jquery-1.4.1.min.js"></script>

<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>

<script type="text/javascript" src="http://dev.baidu.com/wiki/static/map/API/examples/script/convertor.js"></script>

<script type="text/javascript">

    /*准备数据*/

    var gps_info_list = $("#gps_info_list").val();//获取gps信息集合,json格式,格式为{"gps_info:[{'lat':12.120,'lon':12.354,'speed':124.12}]"}

    

    if (gps_info_list == "") {

        alert("GPS数据为空！");

    }



    var gpsList = $.parseJSON(gps_info_list).gps_info; //将gps数据转换为json对象。

    

    

    

    /*准备地图*/

    var map = new BMap.Map("container");

    var point = new BMap.Point(120.45877, 33.19607);

    map.centerAndZoom(point, 18);

    map.addControl(new BMap.NavigationControl());



    //addMarker(new BMap.Point(116.404, 39.915), 0);//添加标记



//    /*编写自定义函数，创建标注*/

//    function addMarker(point, index) {

//        // 创建图标对象  

//        var myIcon = new BMap.Icon("markers.png", new BMap.Size(32, 32), {

//            // 指定定位位置。  

//            // 当标注显示在地图上时，其所指向的地理位置距离图标左上  

//            // 角各偏移10像素和25像素。您可以看到在本例中该位置即是  

//            // 图标中央下端的尖角位置。  

//            offset: new BMap.Size(10, 25),

//            // 设置图片偏移。  

//            // 当您需要从一幅较大的图片中截取某部分作为标注图标时，您  

//            // 需要指定大图的偏移位置，此做法与css sprites技术类似。  

//            imageOffset: new BMap.Size(0, 0 - index * 2)   // 设置图片偏移  

//        });

//        // 创建标注对象并添加到地图 

//        var marker = new BMap.Marker(point, { icon: myIcon });



//        /*为标记天际单击事件*/

//        marker.addEventListener("click", function(e) {

//            alert(e.point.lng + ", " + e.point.lat);

//        });

//        map.addOverlay(marker);

//    }



//        addMarker(new BMap.Point(116.404, 39.915), 0);



    gpsxy = function() {

        var xx = 120.45877;

        var yy = 33.19607;



        for (var i = 0; i < gpsList.length; i++) {

            xx = gpsList[i].lon;

            yy = gpsList[i].lat;





            var gpsPoint = new BMap.Point(xx, yy);

            BMap.Convertor.translate(gpsPoint, 0, function(point) {

                //map.clearOverlays();

                var marker = new BMap.Marker(point);

                map.addOverlay(marker);



                map.setCenter(point);

                

                document.getElementById("baiduXY").innerHTML = point.lng + "," + point.lat;

            });

        }

    }





//    /*添加信息窗口*/

//    var opts = {

//        width: 250,     // 信息窗口宽度  

//        height: 100,     // 信息窗口高度  

//        title: "Hello"  // 信息窗口标题  

//    }

//    var infoWindow = new BMap.InfoWindow("World", opts);  // 创建信息窗口对象  

//    map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口  







//    /*添加折线*/

//    var polyline = new BMap.Polyline([

//			new BMap.Point(116.399, 39.910),

//			new BMap.Point(116.405, 39.920)

//		],

//		{ strokeColor: "blue", strokeWeight: 6, strokeOpacity: 0.5 }

//	);

//    map.addOverlay(polyline);





    /*添加单击事件*/

    /*map.addEventListener("click", function(e){  

    alert(e.point.lng + ", " + e.point.lat);  

    }); */ 

</script>

现在的问题是我需要标记出这些点，并且以其中某一个点为中心，由于点之间不会相隔太远，所以以哪一个点为中心没有特别的要求。。。

map.setCenter(point);这句代码是设置为中心点的，但是由于每一个点都设置为中心点的话，地图看起来在抖动，不是太友好，所以我加jf(i==1)或者if(i<5)尝试了一下，都没有用，不执行。中心点还是定位不到其中的某个描点。

...全文