百度地图展示有单商家和骑手位置

实现效果如图：

大致思路就是

1.先创建一个地图：

var map = new BMap.Map("map"); // 创建Map实例
                    var point = new BMap.Point(116.3917276223, 39.1251928282); //地图中心点
                    map.centerAndZoom(point, 15); // 初始化地图,设置中心点坐标和地图级别。
                    map.enableScrollWheelZoom(true); //启用滚轮放大缩小
                    //向地图中添加缩放控件
                    var ctrlNav = new window.BMap.NavigationControl({
                        anchor: BMAP_ANCHOR_TOP_LEFT,
                        type: BMAP_NAVIGATION_CONTROL_LARGE
                    });
                    map.addControl(ctrlNav);

2.利用ajax返回数据，以此读取商家的信息，展示在地图上

function shangjia(){
                   
                    $.getJSON('http://localhost/baidumap/js/shop.php',function(data){  
                    var markerArr = [];
                    var shopL = data.length;
                for (var g=0;g<shopL;g++) {
                var shopJson = {
                title:data[g].name,
                point:data[g].jing + ',' + data[g].wei,
                order:data[g].danshu,
                id:data[g].id
                }
                markerArr.push(shopJson);
                }
                var point = new Array(); //存放标注点经纬信息的数组
                    var marker = new Array(); //存放标注点对象的数组
                    var info = new Array(); //存放提示信息窗口对象的数组
                    $.each(markerArr, function(i,v) {
                    var id = v.id;//商家id
                    //alert(id[i])
                        var p0 = v.point.split(",")[0]; //
                        var p1 = v.point.split(",")[1]; //按照原数组的point格式将地图点坐标的经纬度分别提出来
                        var name = v.title;
                        point = new window.BMap.Point(p0, p1); //循环生成新的地图点
                        var myIcon = new BMap.Icon("img/[e-mail]", new BMap.Size(50,50));
                        marker = new window.BMap.Marker(point); //按照地图点坐标生成标记
                        marker = new BMap.Marker(point,{icon:myIcon});  // 创建标注                        
                        //marker[i].setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
                        var label = new window.BMap.Label(v.title + ':' + v.order, { offset: new window.BMap.Size(20, -10) });
                        marker.setLabel(label);
                        map.addOverlay(marker);
                        marker.addEventListener("click",getAttr);                       
                    });
                    


                    });
                    //派单函数
                   
                    }

3.同样的方法遍历骑手的信息，展示在地图上。

4.设置每五秒重新加载并展示信息以此