关于使用百度地图插件的显示行政区域的操作

    function getBoundary() { // 设置地图边界线
        var bdary = new BMap.Boundary();
        bdary.get("河北省", function(rs) {
            //map.clearOverlays();        //清除地图覆盖物       
            var strs = new Array();
            strs = rs.boundaries[0].split(";");
            var EN = ""; // 行政区划东北段点的集合
            var NW = ""; // 行政区划西北段点的集合
            var WS = ""; // 行政区划西南段点的集合
            var SE = ""; // 行政区划东南段点的集合
            var pt_e = strs[0]; // 行政区划最东边点的经纬度
            var pt_n = strs[0]; // 行政区划最北边点的经纬度
            var pt_w = strs[0]; // 行政区划最西边点的经纬度
            var pt_s = strs[0]; // 行政区划最南边点的经纬度
            var n1 = ""; // 行政区划最东边点在点集合中的索引位置
            var n2 = ""; // 行政区划最北边点在点集合中的索引位置
            var n3 = ""; // 行政区划最西边点在点集合中的索引位置
            var n4 = ""; // 行政区划最南边点在点集合中的索引位置
            // 2.循环行政区划边框点集合找出最东南西北四个点的经纬度以及索引位置
            for ( var n = 0; n < strs.length; n++) {
                var pt_e_f = parseFloat(pt_e.split(",")[0]);
                var pt_n_f = parseFloat(pt_n.split(",")[1]);
                var pt_w_f = parseFloat(pt_w.split(",")[0]);
                var pt_s_f = parseFloat(pt_s.split(",")[1]);
                var sPt = new Array();
                try {
                    sPt = strs[n].split(",");
                    var spt_j = parseFloat(sPt[0]);
                    var spt_w = parseFloat(sPt[1]);
                    if (pt_e_f < spt_j) { //
                        pt_e = strs[n];
                        pt_e_f = spt_j;
                        n1 = n;
                    }
                    if (pt_n_f < spt_w) { //
                        pt_n_f = spt_w;
                        pt_n = strs[n];
                        n2 = n;
                    }
                    if (pt_w_f > spt_j) { // 西
                        pt_w_f = spt_j;
                        pt_w = strs[n];
                        n3 = n;
                    }
                    if (pt_s_f > spt_w) { //
                        pt_s_f = spt_w;
                        pt_s = strs[n];
                        n4 = n;
                    }
                } catch (err) {
                    alert(err);
                }
            }
            // 3.得出东北、西北、西南、东南四段行政区划的边框点的集合
            if (n1 < n2) { // 第一种情况 最东边点在索引前面
                for ( var o = n1; o <= n2; o++) {
                    EN += strs[o] + ";";
                }
                // 判断西北
                if (n2 < n3) {
                    for ( var o = n2; o <= n3; o++) {
                        NW += strs[o] + ";";
                    }
                } else {
                    for ( var o = n2; o < strs.length; o++) {
                        NW += strs[o] + ";";
                    }
                    for ( var o = 0; o <= n3; o++) {
                        NW += strs[o] + ";";
                    }
                }
                for ( var o = n3; o <= n4; o++) {
                    WS += strs[o] + ";";
                }
                // 判断东南
                if (n4 < n1) {
                    for ( var o = n4; o <= n1; o++) {
                        SE += strs[o] + ";";
                    }
                } else {
                    for ( var o = n4; o < strs.length; o++) {
                        SE += strs[o] + ";";
                    }
                    for ( var o = 0; o <= n1; o++) {
                        SE += strs[o] + ";";
                    }
                }
            } else { // 第二种情况 最东边点在索引后面
                for ( var o = n1; o < strs.length; o++) {
                    EN += strs[o] + ";";
                }
                for ( var o = 0; o <= n2; o++) {
                    EN += strs[o] + ";";
                }
                for ( var o = n2; o <= n3; o++) {
                    NW += strs[o] + ";";
                }
                for ( var o = n3; o <= n4; o++) {
                    WS += strs[o] + ";";
                }
                for ( var o = n4; o <= n1; o++) {
                    SE += strs[o] + ";";
                }
            }
            // 4.自定义外围边框点的集合
            var E_JW = "170.672126,39.623555;"; //
            var EN_JW = "170.672126,81.291804;"; // 东北角
            var NW_JW = "-169.604276,81.291804;"; // 西北角
            var W_JW = "-169.604276,38.244136;"; // 西
            var WS_JW = "-169.604276,-68.045308;"; // 西南角
            var S_JW = "114.15563,-68.045308;"; //
            var SE_JW = "170.672126,-68.045308 ;"; // 东南角
            /*// 4.添加环形遮罩层
            var ply1 = new BMap.Polygon(EN + NW + WS + SE + E_JW + SE_JW + S_JW
                    + WS_JW + W_JW + NW_JW + EN_JW + E_JW, {
                strokeColor : "none",
                fillColor : "#35415A",
                strokeOpacity : 1,
                fillOpacity : 0.4
            }); // 建立多边形覆盖物
            map.addOverlay(ply1); // 遮罩物是半透明的,如果需要纯色可以多添加几层
    */        // 5. 给目标行政区划添加边框,其实就是给目标行政区划添加一个没有填充物的遮罩层
            var count = rs.boundaries.length; //行政区域的点有多少个
            for(var i = 0; i < count; i++){
            var ply = new BMap.Polygon(
                        rs.boundaries[i], 
                        {  
                            strokeColor:"blue",      //边线颜色。  
                            fillColor:"red",        //填充颜色。当参数为空时,圆形将没有填充效果。  
                            strokeWeight: 3,        //边线的宽度,以像素为单位。  
                            strokeOpacity: 0.8,     //边线透明度,取值范围0 - 1。  
                            fillOpacity: 0.3,       //填充的透明度,取值范围0 - 1。  
                            strokeStyle: 'solid'    //边线的样式,solid或dashed。 
                        }); //建立多边形覆盖物 fillColor 字体显示出来
            map.addOverlay(ply); //添加覆盖物
            //map.setViewport(ply.getPath()); //调整视野
            }
        });
        map.centerAndZoom(new BMap.Point(125.552056, 43.658576), 7);
    }
//添加多边形**********************************************************************
var polygon_nc = new BMap.Polygon([
    new BMap.Point(120.333027, 31.532335),
    new BMap.Point(120.311899, 31.550431),
    new BMap.Point(120.326991, 31.5652),
    new BMap.Point(120.355018, 31.557324),
    new BMap.Point(120.354586, 31.537013)   //第五个坐标点
    //new BMap.Point(120.351424, 31.541199),  //6
    //new BMap.Point(120.346538, 31.556831),  //7
    //new BMap.Point(120.331302, 31.568154),  //8
    //new BMap.Point(120.286746, 31.557077),
    //new BMap.Point(120.274386, 31.538244)
    //new BMap.Point(120.331302, 31.568154)
], 
{
   strokeColor:"green",
   fillColor:"red",
   fillColorOpacity:"0.4", 
   strokeWeight:2, 
   strokeOpacity:0.3
});  
map.addOverlay(polygon_nc);   //增加多边形

 

 
posted @ 2017-10-13 14:17  夜西门吹雪孤城花满楼  阅读(1212)  评论(0编辑  收藏  举报