# Geohash 网格热力图层(GeohashGridLayer)
网格图层用于展示与 Geohash
相关的数据,并以 Geohash
网格的形式展示在地图上。
new aimap.GeohashGridLayer(layerOptions: Object)
# 初始化参数
# LayerOptions参数说明
字段名 | 类型 | 说明 |
---|---|---|
id | string | 默认值为${type}.${uuid} ,该值不允许重复。 |
map | Map | 地图对象,如果设置,该图层会自动加载到地图中,如果未设置,需要手动加载图层:addTo(map) 。 |
zIndex | number | 图层在地图中所属的垂直方向的位置索引,默认为 0。 |
minZoom | number | 能显示的最小的zoom level,默认 3。 |
maxZoom | number | 能显示的最大的zoom level(但不包括这个Level),默认20。 |
interactive | boolean | 是否创建默认交互,如鼠标移入移出图层后鼠标样式变化。默认true 。 |
data必须 | Data | 支持点类型的矢量数据,包括SimpleFeature ,GeoJSON 等,具体参见:矢量数据定义。或者,以 Geohash Data 形式组成的数组。 |
style必须 | Style | 本图层支持与面相关的样式配置,包括:填充样式(Fill)。 |
grid必须 | GridOptions | 网格图层相关的配置,具体参见:GridOptions。 |
# Geohash Data
字段名 | 类型 | 说明 |
---|---|---|
geohash | string | geohash 网格的编号。 |
level | number | array参数中的数据需要对应到的geohash 网格级别。 |
array | Array | 每个网格热力的数值组成的数组,长度等于Math.pow(32, level - geohash.length) ,空值使用null 表示。 |
# GridOptions
字段名 | 类型 | 说明 |
---|---|---|
url | string | 网格图层的瓦片服务地址,默认为https://tiles.newayz.com/maps/tilestream/v1/layers/geohash-grids/tiles/{z}/{x}/{y}?geohash_level={level} 。 |
userField | string | 如果传入的data类型为FeatureCollection,通过这个字段来指定数据中与热力效果对应的字段。 |
levels必须 | Object | 配置各个级别的geohash图层的显示层级范围。以levelNumber:{minZoom: number, maxZoom: number} 的形式表示。 |
# 示例
// Data 类型为 FeatureCollection
var geohashGridLayer = new aimap.GeohashGridLayer({
id: 'test',
map,
data: {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [121.472962, 31.233808]
},
"properties": {
"name": "A类",
"count": 50
}
}, {
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [121.501022, 31.120714]
},
"properties": {
"name": "B类",
count: 100
}
}]
},
style: {
'fill-color': [
'interpolate',
['linear'],
['feature-state', 'value'],
0, 'green', 200, 'yellow', 400, 'red'], // 每个矩形,根据value值显示渐变颜色
'fill-opacity': [
'case',
['!=', ['feature-state', 'value'], null], 0.5,
0],
'fill-outline-color': 'rgba(255, 255, 255, 0.5)'
},
grid: {
userField: 'count',
levels: {
6: { // 地图在缩放等级为 11 ~ 13 时显示 6 级网格
minZoom: 11,
maxZoom: 13
},
7: {
minZoom: 13,
maxZoom: 17
}
}
}
});
// Data 类型为 geohash 数组
var geohashGridLayer = new aimap.GeohashGridLayer({
map,
data:[{
geohash: 'wtw3x2',
level: 7,
array: [
null, null, 3, 4, 5, 6, null, null,
9, 10, 11, 12, 13, 14, 15, 16,
17, 18, 19, 20, 21, 22, 23, 24,
25, 26, 27, 28, 29, 30, 31, 32
]
}],
style: {...},
grid: {
levels: {
7: {
minZoom: 13,
maxZoom: 17
}
}
}
});
// Data 类型为带有 geohash 数值的对象数组,其中 geohash 数值使用“grid_id”或者“geohash”字段来表示。
var geohashGridLayer = new aimap.GeohashGridLayer({
map,
data:[ {
"visitor_uv": 85,
"grid_id": "wwmwt30"
},
{
"visitor_uv": 58,
"grid_id": "wwmqjzm"
},],
style: {...},
grid: {
levels: {
7: {
minZoom: 13,
maxZoom: 17
}
}
}
});
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
# 实例变量
# id
此图层的 id,如果在初始化图层的参数中指定,则为参数中的 id,否则 SDK 内部会自动生成一个 id。
# 示例
var geohashgridLayer = new aimap.GeohashGridLayer({...});
console.log(geohashgridLayer.id); // "geohashgrid.9db79b01-f3c0-4da6-a36a-b4d5827c4e37"
2
# type
此图层的类型,对于本图层, type
为固定值:geohashgrid
。
# 示例
var geohashgridLayer = new aimap.GeohashGridLayer({...});
console.log(geohashgridLayer.type); // "geohashgrid"
2
# 实例方法
addTo(map)
如果在初始化图层时,没有传入地图对象参数,则需要使用此方法来将图层添加到地图上。
参数
map(Map)
:需要添加本图层的地图对象。
返回值
GeohashGridLayer
:this
remove()
将本图层从地图中移除,并销毁相关的资源。
返回值
GeohashGridLayer
:this
show()
显示该图层。
返回值
GeohashGridLayer
:this
hide()
隐藏该图层。
返回值
GeohashGridLayer
:this
setzIndex(zIndex, options?)
设置图层在 z 轴上的顺序。数值越大,层级越高。
参数
zIndex(number | String)
:大于 0 的整数或者表示地图初始化样式中自带的图层 id。
options(SetzIndexOptions)
:设置层级的更多参数,具体参见:SetzIndexOptions 配置。
返回值
GeohashGridLayer
:this
setStyle(style, options?)
增量更新图层的样式。
参数
style(style)
:样式对象,这些样式将增量更新到图层已有的样式上,支持的样式与当前图层一致。
options(SetStyleOptions)
:设置新样式的其他配置项,具体参见:SetStyleOptions 配置。
返回值
LineString
:this
setData(data, options?)
重新指定数据,原有的数据会被清除掉。
参数
data(Data)
:与 layeroptions参数说明 中的Data
字段定义一致。
options(SetDataOptions)
:指定新数据源的其他配置项,具体参见:SetDataOptions 配置。
返回值
LineString
:this
setPopup(popup, options)
为图层设置弹窗对象。
参数
popup(Popup | string)
:Popup对象,或者弹窗中想要显示的内容文本。
options(Options)
:弹窗的配置项,具体参见:Popup 配置
返回值
LineString
:this
togglePopup()
切换弹窗的显示,隐藏效果。
返回值
LineString
:this
on(type, listener)
为图层绑定事件监听。
参数
type(string)
:事件类型,支持的事件类型可参考 图层事件。
listener(Function)
:如果此处使用匿名函数,则后续将无法解绑。
返回值
LineString
:this
once(type, listener)
为图层绑定事件监听,事件只会响应一次。
参数
type(string)
:事件类型,支持的事件类型可参考 图层事件。
listener(Function)
:如果此处使用匿名函数,则后续将无法解绑。
返回值
LineString
:this
off(type, listener)
解除已绑定事件监听。
参数
type(string)
:事件类型,支持的事件类型可参考 图层事件。
listener(Function)
:通过 on
或者 once
绑定的事件对象。
返回值
LineString
:this
# 图层事件
mousedown
当鼠标点击图层时触发。
mouseup
当鼠标在图层中松开时触发。
click
当鼠标在图层同一点处点击并松开时触发。
dblclick
当鼠标双击图层同一点时触发。
mousemove
当鼠标在图层中移动时触发。
mouseenter
当鼠标从某一图层外部或地图画布外部进入当前图层的可见部分时触发。
mouseleave
当鼠标离开当前图层的可见部分时触发。