【百度地图】仅显示中国边界区域

本篇的主要思路是通过绘制全国的行政区划边界点来添加遮罩层从而视觉上达到只显示中国区域的效果,具体实现看代码:
一、Js

//绘制中国区域行政边界
function drawBoundary() {
    /*画遮蔽层的相关方法
     *思路: 首先在中国地图最外画一圈,圈住理论上所有的中国领土,然后再将每个闭合区域合并进来,并全部连到西北角。
     *      这样就做出了一个经过多次西北角的闭合多边形*/
    //定义中国东南西北端点,作为第一层
    //向数组中添加一次闭合多边形,并将西北角再加一次作为之后画闭合区域的起点
    var pStart = new BMap.Point(180,90);
    var pEnd = new BMap.Point(0,-90);
    var pArray = [
        new BMap.Point(pStart.lng,pStart.lat),
        new BMap.Point(pEnd.lng,pStart.lat),
        new BMap.Point(pEnd.lng,pEnd.lat),
        new BMap.Point(pStart.lng,pEnd.lat)
    ];
    //循环添加各闭合区域
    $.get('./ChinaPly.json',{},function (data) { //此处替换为自己的文件地址
        var chinaPly=data.chinaPly;
        $.each(chinaPly,function (index,value) {
            pArray.push(new BMap.Point(value[0],value[1]));
        });
        //添加遮蔽层
        var plyall = new BMap.Polygon(pArray,
            { strokeOpacity: 1, strokeColor: "#091934",
                strokeWeight: 1, fillColor: "#091934",fillOpacity: 1 }); //建立多边形覆盖物
        map.addOverlay(plyall);

        pStart = new BMap.Point(180,90);
        pEnd = new BMap.Point(0,-90);
        pArray = [
            new BMap.Point(135.077218,48.454352),
            new BMap.Point(pStart.lng,pStart.lat),
            new BMap.Point(pStart.lng,pEnd.lat),
            new BMap.Point(135.077218,48.454352)];
        var boundary = new BMap.Polygon(pArray,
            { strokeOpacity: 1, strokeColor: "#091934",
                strokeWeight: 1, fillColor: "#091934",fillOpacity: 1}); //建立多边形覆盖物
        map.addOverlay(boundary);
    });
}

在初始化地图以及地图缩放时调用此方法,比如:

map.addEventListener("zoomstart", function () {
         drawBoundary(); //绘制中国区域行政边界
 });

二、Json文件

{"chinaPly":[
          [135.077218,48.544352],
          [134.92218,48.584352],
          [134.827218,48.534352],
          [134.727669,48.495377],
          [134.304531,48.394091],
          [133.513447,48.177476],
          [132.832747,48.054205],
          [132.519993,47.789172],
          [131.765704,47.813962],
          [131.103402,47.776772],
          [130.919429,48.331824],
          [130.77225,48.868729],
          [129.907577,49.351849],
          [128.73015,49.699156],
          [127.791888,49.85404],
          [127.791888,50.492084],
          [126.927215,51.616759],
          [126.467283,52.579818],
          [125.952158,53.059077],
          [124.701142,53.313247],
          [123.56051,53.664362],
          [121.555204,53.46722],
          [120.340983,53.125528],
          [119.95464,52.579818],
          [120.616942,52.523746],
          [120.506559,52.095236],
          [119.862653,51.616759],
          [119.365926,50.959196],
          [119.089967,50.362806],
          [119.108364,50.05583],
          [118.133307,49.925357],
          [117.471005,49.794528],
          [116.808702,49.889712],
          [116.385564,49.758785],
          [115.962426,48.953617],
          [115.520891,48.147476],
          [115.796851,47.677465],
          [116.27518,47.652609],
          [117.103059,47.652609],
          [118.004526,47.801568],
          [118.887596,47.577968],
          [119.402721,47.127871],
          [119.402721,46.800397],
          [118.464459,46.825659],
          [117.103059,46.648575],
          [115.980824,46.088213],
          [115.226534,45.702829],
          [114.159491,45.275796],
          [112.761297,45.171782],
          [111.639061,45.132727],
          [111.436691,44.55683],
          [111.51028,44.001703],
          [110.682402,43.387647],
          [108.897864,42.658724],
          [106.892559,42.522781],
          [103.82021,42.140555],
          [102.422016,42.536389],
          [101.336575,42.82146],
          [99.478448,42.929712],
          [97.601924,42.997272],
          [96.019756,43.815487],
          [92.72664,45.288784],
          [91.144473,45.599605],
          [91.457227,46.483616],
          [90.794924,47.553064],
          [89.562305,48.221295],
          [88.2377,48.953617],
          [87.722576,49.279683],
          [87.097067,49.255604],
          [86.60034,49.122957],
          [86.177203,48.710696],
          [85.533297,48.344091],
          [85.404516,47.875888],
          [85.349324,47.390897],
          [84.926186,47.215692],
          [83.233635,47.315881],
          [82.865689,47.328391],
          [82.258578,45.844449],
          [82.368962,45.366651],
          [82.093003,45.30177],
          [80.989165,45.275796],
          [79.903724,45.015402],
          [80.326862,44.332772],
          [80.510835,43.642047],
          [80.621219,43.186043],
          [80.27167,43.010775],
          [79.885327,42.304653],
          [79.259819,41.838593],
          [78.487133,41.576647],
          [77.916816,41.341363],
          [77.272911,41.16086],
          [76.739389,41.02167],
          [76.26106,40.546202],
          [75.672346,40.75639],
          [74.881262,40.630357],
          [74.255754,40.293095],
          [73.777425,39.939968],
          [73.74063,39.556517],
          [73.53826,39.34256],
          [73.685438,38.725549],
          [74.034987,38.407771],
          [74.458125,38.335352],
          [74.734084,38.074036],
          [74.844468,37.577865],
          [74.678892,37.21089],
          [74.6237,36.975076],
          [75.414784,36.501232],
          [75.801127,35.934721],
          [76.518622,35.379154],
          [77.309706,35.137703],
          [77.972008,34.758986],
          [78.376749,34.241106],
          [78.523927,33.473647],
          [78.7079,32.978834],
          [78.450338,32.745921],
          [78.30316,32.340745],
          [78.431941,32.04349],
          [78.671106,31.572152],
          [78.855079,31.145879],
          [79.425395,30.797108],
          [80.087697,30.447053],
          [81.301919,29.855455],
          [81.90903,30.0157],
          [82.7921,29.485907],
          [84.539843,28.661613],
          [85.71727,28.124721],
          [86.821108,27.732537],
          [87.998535,27.69979],
          [88.568851,27.716165],
          [88.863208,27.108656],
          [89.580703,27.190949],
          [89.654292,27.765274],
          [90.923705,27.650651],
          [91.751584,27.223849],
          [92.04594,26.778874],
          [92.965805,26.646689],
          [93.830478,26.960375],
          [94.860727,27.453873],
          [96.185332,27.798001],
          [97.123594,27.503101],
          [97.620321,27.896122],
          [97.675513,28.059457],
          [98.080254,27.306056],
          [98.595378,27.009824],
          [98.393008,26.066566],
          [97.804294,25.483523],
          [97.528335,24.847254],
          [97.417951,24.10637],
          [97.804294,23.717348],
          [98.595378,23.886634],
          [98.834543,23.123105],
          [99.239283,22.697005],
          [99.165694,22.303805],
          [99.386462,21.857966],
          [100.251135,21.445169],
          [100.839848,21.290063],
          [101.704521,21.031186],
          [102.05407,21.152053],
          [101.998878,21.582901],
          [101.962083,22.132497],
          [102.587591,22.355156],
          [103.599443,22.338041],
          [104.482513,22.560368],
          [105.383981,22.799392],
          [106.083078,22.59454],
          [106.469421,22.286683],
          [106.874162,21.754879],
          [107.315697,21.514051],
          [107.812424,21.410715],
          [107.775629,21.134792],
          [106.929353,20.269201],
          [106.175064,19.17158],
          [106.377435,18.470789],
          [107.297299,17.23746],
          [109.008248,15.675143],
          [109.688948,13.705222],
          [109.652153,11.664031],
          [108.750686,9.571001],
          [108.198767,6.876803],
          [108.493124,5.090099],
          [109.817729,3.612656],
          [111.10554,3.298351],
          [114.71141,5.514272],
          [116.256783,7.556636],
          [118.758815,10.883133],
          [119.531502,13.669242],
          [119.494707,16.617614],
          [120.414572,18.961654],
          [121.51841,20.633358],
          [122.751029,22.303805],
          [123.247756,23.378111],
          [124.811526,25.68375],
          [126.577667,25.900278],
          [127.479134,26.67975],
          [128.454191,28.189945],
          [128.766945,29.93561],
          [128.73015,31.650877],
          [127.957464,32.153119],
          [127.221572,32.745921],
          [127.019202,33.596907],
          [125.988953,33.827543],
          [125.731391,34.546135],
          [125.878569,35.454458],
          [125.731391,36.634799],
          [125.80498,37.51927],
          [124.425183,37.972159],
          [124.498772,38.58128],
          [125.013896,39.242487],
          [124.590758,39.471014],
          [124.296402,39.840762],
          [124.388388,40.081441],
          [124.940307,40.335346],
          [125.731391,40.630357],
          [126.448885,40.96591],
          [126.798434,41.493704],
          [127.111188,41.410654],
          [127.883875,41.271998],
          [128.490985,41.452192],
          [128.307012,41.879854],
          [128.950918,41.921089],
          [129.484439,42.12686],
          [129.999564,42.549994],
          [130.073153,42.807915],
          [130.404304,42.495557],
          [130.77225,42.359256],
          [130.698661,42.726583],
          [131.195388,42.848541],
          [131.360964,43.494895],
          [131.342566,44.491021],
          [131.820896,45.002351],
          [132.998323,44.976239],
          [133.623831,45.599605],
          [134.102161,46.394582],
          [134.37812,47.228226],
          [134.874847,47.851127],
          [134.985231,48.233588],
          [135.13241,48.454352],
          [135.077218,48.474352]
    ]
}

三、效果图
在这里插入图片描述
在这里插入图片描述
本篇参考博客js使用百度地图仅显示中国区域,实现大数据热点图,感谢大神提供资源!

百度地图提供了一种方便的方法,可以通过JSON边界下载来获取地图数据。 首先,要使用百度地图JSON边界下载功能,需要使用开发者密钥。开发者密钥用于向百度地图API发送请求,并获取相应的地图数据。 接下来,可以通过发送HTTP GET请求来获取JSON边界数据。在请求URL中,需要包含相应的参数,如请求类型(type)为边界类型(bound)等。百度地图支持多个边界类型,例如省级边界(province)、市级边界(city)和区县级边界(district)等。 请求发送后,百度地图API会返回相应的JSON数据,其中包括了所请求的边界数据。可以通过解析JSON数据,获取到地图的边界坐标信息。 对于省、市、区县等不同级别的边界数据,百度地图提供了相应的接口和参数,可以根据需求进行选择和调整。例如,可以通过设置返回数据的坐标类型(坐标系类型),进行数据的适配和转换。 JSON边界下载功能在许多应用场景中都有广泛的应用。例如,可以通过获取市级边界数据,进行城市边界划定和画图等操作。也可以通过获取区县边界数据,进行行政区划相关的分析和展示等。 总之,百度地图JSON边界下载功能提供了一种方便的方式,可以获取到所需的地图边界数据。通过发送请求,并解析返回的JSON数据,可以实现对地图数据的灵活应用和定制。
评论 16
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值