Fx构造函数

# new MapvBaseLayer(map, dataSet, options, leafletLayer)

参数:

名称	类型	描述
`map`	Object	传入的leaflet的地图对象
`dataSet`	MapvDataSet	传入的mapv的属性。
`options`	MapvOption	可选参数。
`leafletLayer`	Object	传入的leaflet的实际渲染图层。

查看源代码 leaflet/overlay/mapv/MapvBaseLayer.js, line 15

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, // 单个动画的时间，单位秒
    }
}

方法

# clickEvent(e)

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

参数:

名称	类型	描述
`e`	Object	点击事件对象 {latlng, layerPoint, containerPoint, originalEvent}

查看源代码 leaflet/overlay/mapv/MapvBaseLayer.js, line 94

Example

//mapv.map.BaseLayer.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()

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

查看源代码 leaflet/overlay/mapv/MapvBaseLayer.js, line 194

# mousemoveEvent(e)

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

参数:

名称	类型	描述
`e`	Object	点击事件对象 {latlng, layerPoint, containerPoint, originalEvent}

查看源代码 leaflet/overlay/mapv/MapvBaseLayer.js, line 120

Example

//mapv.map.BaseLayer.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);
  }
}