Class: HoneycombLayer

HoneycombLayer

蜂巢六边形聚合图

  const data = [
    {
      geometry:{
        type: 'Point',
        coordinates: [ 117.353555 ,39.319425 ]
      },
      count: 30
    },
    {
      geometry:{
        type: 'Point',
        coordinates: [ 117.354555 ,39.319425 ]
      },
      count: 35
    }
  ]
  const mapvOptions = {
    fillStyle: 'rgba(55, 50, 250, 0.8)',
    shadowColor: 'rgba(255, 250, 50, 1)',
    shadowBlur: 20,
    max: 100,
    size: 50,
    unit: 'px',
    label: {
      show: true,
      fillStyle: 'white'
    },
    globalAlpha: 0.5,
    gradient: {
      0.25: 'rgb(0,0,255)',
      0.55: 'rgb(0,255,0)',
      0.85: 'yellow',
      1.0: 'rgb(255,0,0)'
    },
    draw: 'grid'
  }
  var options = {
    map: this.$map,
    data: data,
    mapvOptions: mapvOptions
  }
  const layer = new HoneycombLayer(options)
  this.$map.addLayer(layer)

new HoneycombLayer(options)

layer/HoneycombLayer.js, line 56

构造一个mapv蜂巢图

Name Type Description
options HoneycombLayerOptions

通过MarkerOptions设置点标记对象的属性

Name Type Description
map Object

地图对象
data Array

蜂巢图数据

Name Type Description
geometry Object

几何参数

Name Type Description
type String

几何类型，通常选择Point
coordinates Array

最小点位置，[ lng ,lat ]
count Array

最小点权重，以数字形式添加到最小缩放层级
mapvOptions Object

蜂巢图样式参数

Name Type Description
fillStyle RGB

填充颜色'rgba(55, 50, 250, 0.8)'
shadowColor RGB

阴影颜色'rgba(255, 250, 50, 1)',
shadowBlur Number

阴影焦点'rgba(255, 250, 50, 1)',
max Number

合并尺度
size Number

单一蜂巢格大小
unit Number

unit可选值['px', 'm']，默认值为'px'
label Object

是否添加文字

Name Type Description
show Boolean

是否添加文字
fillStyle RGB

文字颜色 'white'
globalAlpha Number

图层透明度
gradient Number

单一蜂巢聚合层级展示渐变
draw Number

蜂巢图/方块图 'honeycomb'/'grid'
zIndex Number

图层顺序 更多参数请参考 @link {ImageLayer|https://openlayers.org/en/latest/apidoc/module-ol_layer_Image-ImageLayer.html}

Classes

HoneycombLayer

Methods

addData(options)

layer/HoneycombLayer.js, line 108

追加数据，在图层渲染结束之后可使用

Name Type Description
options Object

要追加的数据

Name Type Description
data Array

要追加的值

clear()

layer/HoneycombLayer.js, line 151

清除数据，在图层渲染结束之后可使用

getData(){DataSet}

layer/HoneycombLayer.js, line 122

获取数据

Returns:
Type Description
DataSet MapV 数据集

removeData(filter)

layer/HoneycombLayer.js, line 138

删除符合过滤条件的数据，在图层渲染结束之后可使用

Name Type Description
filter function

过滤条件。条件参数为数据项，返回值为 true，表示删除该元素；否则表示不删除
Example
filter=function(data){
   if(data.id=="1"){
     return true
   }
   return false;
 }

update(options)

layer/HoneycombLayer.js, line 166

更新数据，在图层渲染结束之后可使用

Name Type Description
options Object

待更新的数据。

Name Type Description
data Array

数据集。