百度地图离线开发demo-海量数据绘制

demo内容有：（海量数据地图绘制，迁徙图，弹窗边界避让的问题，热力图，初始化离线地图），不要订阅了。有需要可以评论问我。。。。demo列的都是我有写过，并且实现的。有需求也可以说。我有时间写demo。瓦片没有找到免费的！我也没找到！可以自行找免费的瓦片！

数据量大的marker，绘制，api有提供海量数据绘制方案，但是图标不可自定义

 如果采用批量icon-marker的方式，支持传入图标，采取dom节点绘制，但是数据量一大，会导致js阻塞，卡住，也没法接受。采用mapv解决海量数据绘制问题（最大数量级应该几万不会卡，再大还是采用聚合吧，毕竟几万点不聚合，也没法看，只能放大层级，那就聚合就行了）

mapv使用canvas绘制的方式，绘制canvas图层，而bmapgl版本，也要对应的mapvgl版本，可用于一些可视化大屏的效果

<script src="/mapSource/offlineMapLib/mapv.js"></script>

/**
 * mapv进行大数据绘制
 * @markList 点要素数据
 */
manyPointMpv(markList = []) {
  const data = [[], [], [], [], [], [], [], [], [], [], []] // 目前写死，可优化为动态长度
  markList.forEach((item) => {
    // 构造数据
    data[item.projectStatus].push(
      {
        geometry: {
          type: 'Point',
          coordinates: [item.lng, item.lat],
          dataItem: item
        },
        icon: this.projectStatusIcon[item.projectStatus],
        deg: 0,
        width: 19,
        height: 26
      }
    )
  })
  data.forEach((item, index) => {
    const dataSet = new mapv.DataSet(item)

    const options = {
      draw: 'icon',
      // fillStyle: 'rgba(255, 50, 50, 0.6)',
      // shadowColor: 'rgba(255, 50, 50, 1)',
      // shadowBlur: 0,
      // globalCompositeOperation: 'lighter',
      methods: {
        // 点击
        click: (item) => {
          // console.log(item)
        },
        // 移入移出都在此， 移出则为null
        mousemove: (e) => {
          // console.log(e)
        }
      }
      // size: 12
      // updateImmediate: true,
    }

    // eslint-disable-next-line new-cap
    this.mapvLayer[index] = new mapv.baiduMapLayer(this.map, dataSet, options)
  })
}