Class: MapvBaseLayer

MapvBaseLayer

new L.zondy.MapvBaseLayer(map, dataSet, options, leafletLayer)

engineExtensions/layer/mapV/MapvBaseLayer.js, line 6

MapV的核心渲染图层，这里是直接集成的baiduMapLayer，原因在于mapv的对外导出exports的就是baiduMapLayer

Name Type Description
map Object

传入的leaflet的地图对象
dataSet MapvDataSet

传入的mapv的属性。

options MapvOption

可选参数。
leafletLayer Object

传入的leaflet的实际渲染图层。
Example
options = {
    zIndex: 1, // 层级
    size: 5, // 大小值
    unit: 'px', // 'px': 以像素为单位绘制,默认值。'm': 以米制为单位绘制，会跟随地图比例放大缩小
    mixBlendMode: 'normal', // 不同图层之间的叠加模式，参考[https://developer.mozilla.org/en-US/docs/Web/CSS/mix-blend-mode](https://developer.mozilla.org/en-US/docs/Web/CSS/mix-blend-mode)
    fillStyle: 'rgba(200, 200, 50, 1)', // 填充颜色
    strokeStyle: 'rgba(0, 0, 255, 1)', // 描边颜色
    lineWidth: 4, // 描边宽度
    globalAlpha: 1, // 透明度
    globalCompositeOperation: 'lighter', // 颜色叠加方式
    coordType: 'bd09ll', // 可选百度墨卡托坐标类型bd09mc和百度经纬度坐标类型bd09ll(默认)
    shadowColor: 'rgba(255, 255, 255, 1)', // 投影颜色
    shadowBlur: 35,  // 投影模糊级数
    updateCallback: function (time) { // 重绘回调函数，如果是时间动画、返回当前帧的时间
    },
    shadowOffsetX: 0,
    shadowOffsetY: 0,
    context: '2d', // 可选2d和webgl，webgl目前只支持画simple模式的点和线
    lineCap: 'butt',
    lineJoin: 'miter',
    miterLimit: 10,
    methods: { // 一些事件回调函数
        click: function (item) { // 点击事件，返回对应点击元素的对象值
            console.log(item);
        },
        mousemove: function(item) { // 鼠标移动事件，对应鼠标经过的元素对象值
            console.log(item);
        }
    },
    animation: {
        type: 'time', // 按时间展示动画
        stepsRange: { // 动画时间范围,time字段中值
            start: 0,
            end: 100
        },
        trails: 10, // 时间动画的拖尾大小
        duration: 5, // 单个动画的时间，单位秒
    }
}

Methods

clickEvent(e)

engineExtensions/layer/mapV/MapvBaseLayer.js, line 82

百度mapv原本的事件只有clickEvent和mousemoveEvent

Name Type Description
e Object

点击事件对象 {latlng, layerPoint, containerPoint, originalEvent}
Example
//mapv.map.Layer.clickEvent
clickEvent(pixel, e) {
   var dataItem = this.isPointInPath(this.getContext(), pixel);
   if (dataItem) {
      this.options.methods.click(dataItem, e);
   } else {
      this.options.methods.click(null, e);
   }
 }

initDevicePixelRatio()

engineExtensions/layer/mapV/MapvBaseLayer.js, line 182

window.devicePixelRatio是设备上物理像素和设备独立像素(device-independent pixels (dips))的比例。 公式表示就是：window.devicePixelRatio = 物理像素 / dips,该函数主要应用与移动设备

mousemoveEvent(e)

engineExtensions/layer/mapV/MapvBaseLayer.js, line 108

百度mapv原本的事件只有clickEvent和mousemoveEvent

Name Type Description
e Object

点击事件对象 {latlng, layerPoint, containerPoint, originalEvent}
Example
//mapv.map.Layer.mousemoveEvent
mousemoveEvent(pixel, e) {
  var dataItem = this.isPointInPath(this.getContext(), pixel);
  if (dataItem) {
      this.options.methods.mousemove(dataItem, e);
  } else {
      this.options.methods.mousemove(null, e);
  }
}