效果如下：
1 var blist = []
2 var districtLoading = 0
3
4
5 var map = new window.BMap.Map("container",{ minZoom:5,maxZoom:20 });// 创建地图实例
6 var point = new window.BMap.Point(89.48,31.57);
7 map.centerAndZoom(point,7.4);//设置中心点坐标和地图级别
8 map.enableScrollWheelZoom(); // 允许滚轮缩放
9 this.zoom = map.getZoom();
10 this.map = map;
11 this.getBoundary();
12
13
14
15
16
17 /*
18 =====获取行政区域边界=====
19 */
20 getBoundary() {
21 this.addDistrict("西藏");
22 },
23 /*
24 =====添加行政区域=====
25 */
26 addDistrict(districtName) {
27 let that = this;
28 //使用计数器来控制加载过程
29 districtLoading++;
30 var bdary = new BMap.Boundary();
31 bdary.get(districtName, function (rs) { //获取行政区域
32 var count = rs.boundaries.length; //行政区域的点有多少个
33 for (var i = 0; i < count; i++) {
34 blist.push({ points: rs.boundaries[i], name: districtName });
35 };
36 //加载完成区域点后计数器-1
37 districtLoading--;
38 if (districtLoading == 0) {
39 //全加载完成后画端点
40 that.drawBoundary();
41 }
42 });
43 },
44 /*
45 =====点击行政区域事件=====
46 */
47 click(evt) {
48 alert(evt.target.name);
49 },
50 /*
51 =====绘制边界=====
52 */
53 drawBoundary() {
54 let that = this;
55 //包含所有区域的点数组
56 var pointArray = [];
57 //循环添加各闭合区域
58 for (var i = 0; i < blist.length; i++) {
59 //添加多边形层并显示
60 var ply = new BMap.Polygon(blist[i].points, {
61 strokeWeight: 2, //边框宽度
62 trokeColor: "#FFA96E", //边框颜色
63 fillColor: " #DDE4F070" //填充颜色
64 }); //建立多边形覆盖物
65 ply.name = blist[i].name;
66 // ply.addEventListener("click", that.click);
67 this.map.addOverlay(ply);
68
69 //将点增加到视野范围内
70 var path = ply.getPath();
71 pointArray = pointArray.concat(path);
72 }
73
74 //限定显示区域(只显示特定区域，鼠标拖动松开后自动回到显示范围内)，需要引用api库
75 // var boundply = new BMap.Polygon(pointArray);
76 // BMapLib.AreaRestriction.setBounds(map, boundply.getBounds());
77 this.map.setViewport(pointArray); //调整视野
78 },
79