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

2023-11-13 00:59| 来源: 网络整理| 查看: 265

本篇的主要思路是通过绘制全国的行政区划边界点来添加遮罩层从而视觉上达到只显示中国区域的效果，具体实现看代码：一、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使用百度地图仅显示中国区域，实现大数据热点图，感谢大神提供资源！

【本文地址】

公司简介

联系我们