百度地图做网点地图-jeecms

  之前总觉得什么插件,框架。。都有api和既有的套路去实现,会很容易实现。。。。。然而今天把百度地图用于公司设备的网点地图,还是耗时挺多的~~这里仅仅是为了记录一下完成了这个功能!就是把所有点都显示在地图上,开始不知道有方法了,自己想应该怎么去实现,怎么才能把所有点放在地图里面,获取所有点x、y的最大最小值。。。。。哈哈,后面才发现百度已经有做这个方法,直接扔数组进去就o了~~~~~

网站用了jeecms,这里就只放js

    var arr= [];
    var li = [];

    [@cms_content_list typeId='1' count='100' channelId='103' orderBy='4']
        [#list tag_list as a5]
            arr.push([${a5.attr.site}, '${a5.title}', '${a5.attr.xxdz}']);
        [/#list]
    [/@cms_content_list]

    for(var j=0; j<arr.length; j++){
        li.push(new BMap.Point(arr[j][0],arr[j][1]));
    }

    var map = new BMap.Map("map-box");  // 创建地图实例  
        map.enableScrollWheelZoom(true);
        map.setViewport(li);    //设置所有点都在地图上

    for(var i = 0; i<arr.length; i++){
        var opts = {
            width : 250,
            offset   : new BMap.Size(0, -22),
            title : '<span class="iwTitle" title="'+ arr[i][2] +'">'+ arr[i][2] +'</span>', // 信息窗口标题 
        };
        var content = '<span class="iwContent" title="'+ arr[i][3] +'">'+ arr[i][3] +'</span>';
        // 创建标注对象并添加到地图 
        var marker = new BMap.Marker(new BMap.Point(arr[i][0], arr[i][1]));    
        map.addOverlay(marker);
        addClickHandler(content,marker,opts);
    }

    function addClickHandler(content,marker,opts) {
        marker.addEventListener("click",function(e){
            openInfo(content,e,opts)}
        );
    }
    function openInfo(content,e,opts){
        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); //开启信息窗口
    }

 

posted @ 2017-05-10 16:59  Jerry24  阅读(768)  评论(0编辑  收藏  举报