vue-baidu-map 区域划分

vue-baidu-map 是基于百度地图的 Vue.js 组件库，用于在网页中集成百度地图。要实现区域划分，可以借助百度地图提供的覆盖物功能。

首先，在组件中引入百度地图：

<template>
  <div class="map-wrapper">
    <baidu-map :ak="ak" v-on:ready="onMapReady"></baidu-map>
  </div>
</template>

<script>
import BaiduMap from 'vue-baidu-map'

export default {
  components: {
    BaiduMap
  },
  data () {
    return {
      ak: 'Your Baidu Map AK'
    }
  },
  methods: {
    onMapReady (BMap) {
      // 在地图加载完成后执行
    }
  }
}
</script>

然后，在 onMapReady 回调函数中创建覆盖物，例如区域多边形：

onMapReady (BMap) {
  const map = new BMap.Map('baidu-map-container')
  map.centerAndZoom(new BMap.Point(116.404, 39.915), 15)

  const points = [
    new BMap.Point(116.387112,39.920977),
    new BMap.Point(116.385243,39.913063),
    new BMap.Point(116.394226,39.917988),
    new BMap.Point(116.401772,39.921364),
    new BMap.Point(116.41248,39.927893),
    new BMap.Point(116.407274,39.921437),
    new BMap.Point(116.418468,39.903591),
    new BMap.Point(116.416574,39.897081),
    new BMap.Point(116.394852,39.891365),
    new BMap.Point(116.381876,39.890302),
    new BMap.Point(116.375501,39.889406),
    new BMap.Point(116.369762,39.897227),
    new BMap.Point(116.370588,39.910304),
    new BMap.Point(116.37892,39.914477),
    new BMap.Point(116.387112,39.920977)
  ]

  const polygon = new BMap.Polygon(points, {
    strokeColor: 'blue',
    strokeWeight: 2,
    fillColor: 'rgba(0, 0, 255, 0.1)'
  })

  map.addOverlay(polygon)
}

以上代码创建了一个包含多个坐标点的多边形覆盖物，并将其添加到地图上。通过设置多边形的 strokeColor、strokeWeight 和 fillColor 属性可以调整边框颜色、边框宽度和填充颜色。

需要注意的是，vue-baidu-map 组件的 ready 事件回调函数中，第一个参数是 BMap 对象，可以通过该对象创建覆盖物等地图相关操作。