GeoGlobe JS SDK

Class: HexagonLayer

.Visuals.DeckGL. HexagonLayer

基于DeckGL的六角柱图

new HexagonLayer()

Author:
  • liuck
Source:
View2D/Visuals/DeckGL/HexagonLayer.js
Example
//构造地图对象
var map = new GeoGlobe.Map({
    style: Cfg.style,
    container: 'map',
    zoom: 6.6,
    bearing: -27.396674584323023,
    pitch: 40.5,
    units: "degrees",
    center: [-1.4157267858730052,52.232395363869415]
});
//构造DeckGL可视化图层
var deckgl = new GeoGlobe.Visuals.DeckGL();
//绑定初始构建事件
deckgl.on('overlayerinit', function(e){

});
//绑定鼠标点击事件
deckgl.on('overlayerclick', function(e,a,b){

});
//绑定鼠标移动事件
deckgl.on('overlayerhover', function(e,a,b){

})
//添加到地图中
deckgl.addTo(map);
//构造六角柱图层
var hexagonLayer = new GeoGlobe.Visuals.DeckGL.HexagonLayer({
	id: '3D六角柱',
    data: [
    	{ "type": "Feature", "properties": { "id": 10001, "name": "1号柱" }, "geometry": { "type": "Point", "coordinates": [114.20257245367856, 30.773372078561778] } }
	],
    visible: true,
    pickable: true,
    fp64: false,
    extruded: true,
    opacity: 1,
    elevationScale: 50,
    radius: 2000,
	upperPercentile: 100,
	coverage:1,
	elevationRange: [0, 3000]
});
//添加到DeckGL图层
hexagonLayer.addTo(deckgl);
//绘制
deckgl.render();

Members

colorDomain :Array

色标图将数字域继续到离散的颜色范围。 如果未提供，该图层将colorDomain设置为每个六边形中的计数范围。 您可以通过传入任意颜色域来控制六边形的颜色如何映射到计数数。 当您想要使用相同的颜色映射呈现不同的数据输入以进行比较时，此属性非常方便。
Type:
  • Array
Default Value:
  • null
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

colorRange :Array

六边形颜色范围为格式为[[255,255,255,255]]的颜色数组。 默认为colorbrewer 6级YlOrRd。
Type:
  • Array
Default Value:
  • [[255, 255, 178],[254, 217, 118],[254, 178, 76],[253, 141, 60],[240, 59, 32],[189, 0, 38]]
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

coverage :Int

六角半径乘数，夹在0-1之间。六边形的最终半径由coverage * radius计算。 注意：覆盖范围不会影响点的分区方式。 bin的半径仅由radius属性确定。
Type:
  • Int
Default Value:
  • 1
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

data :Array

geojson结构
Type:
  • Array
Source:
View2D/Visuals/DeckGL/HexagonLayer.js
Example
[{
"type": "Feature",
"properties": {
		"id": 10001,
		"name": "1号柱"
	},
"geometry": {
		"type": "Point",
		"coordinates": [114.20257245367856, 30.773372078561778]
	}
}]

elevationDomain :Array

高程比例是一个线性比例，它将计数数量映射到高程。 默认情况下，它设置为每个六边形中0到最大点数之间。 当您想要使用相同的高程比例渲染不同的数据输入以进行比较时，此属性非常方便。
Type:
  • Array
Default Value:
  • null
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

elevationLowerPercentile :Int

过滤垃圾箱并通过elevationLowerPercentile重新计算高程。 高程值小于elevationLowerPercentile的六边形将被隐藏。
Type:
  • Int
Default Value:
  • 0
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

elevationRange :Array

高程刻度输出范围
Type:
  • Array
Default Value:
  • [0, 1000]
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

elevationScale :Int

实际高程由elevationScale * getElevation（d）计算。 elevationScale是一个方便的属性，可以在不更新数据的情况下缩放所有六边形。
Type:
  • Int
Default Value:
  • 1
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

elevationUpperPercentile :Int

过滤垃圾箱并通过elevationUpperPercentile重新计算高程。 高程值大于elevationUpperPercentile的六边形将被隐藏。
Type:
  • Int
Default Value:
  • 100
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

extruded :Boolean

是否启用单元格提升。 通过每个细胞中的点数计数细胞高度。 如果设置为false，则所有单元格将保持平坦。
Type:
  • Boolean
Default Value:
  • false
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

fp64 :Boolean

是否开启高精度64位模式
Type:
  • Boolean
Default Value:
  • true
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

id :String

图层id
Type:
  • String
Default Value:
  • '1'
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

lightSettings :Object

这是一个包含拉伸多边形的灯光设置的对象
Type:
  • Object
Default Value:
  • {}
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

lowerPercentile :Int

过滤垃圾箱并通过lowerPercentile重新计算颜色。 颜色值小于lowerPercentile的六边形将被隐藏。
Type:
  • Int
Default Value:
  • 0
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

name :String

图层名称
Type:
  • String
Default Value:
  • ''
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

opacity :Float

透明度 0-1
Type:
  • Float
Default Value:
  • 1.0
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

pickable :Boolean

是否开启鼠标拾取
Type:
  • Boolean
Default Value:
  • true
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

radius :Int

六角形槽的半径，以米为单位。 六边形是尖顶（而不是平顶）。
Type:
  • Int
Default Value:
  • 1000
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

upperPercentile :Int

过滤垃圾箱并通过upperPercentile重新计算颜色。 颜色值大于upperPercentile的六边形将被隐藏。
Type:
  • Int
Default Value:
  • 100
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

visible :Boolean

可见性
Type:
  • Boolean
Default Value:
  • true
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

Methods

addTo(deckgl)

关联DeckGL
Parameters:
Name Type Description
deckgl GeoGlobe.Visuals.DeckGL
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

getColorValue(points)

getColorValue是获取bin颜色所基于的值的访问器函数。 它将每个bin中的一组点作为参数，返回一个数字。 例如，您可以传入getColorValue，以通过每个点的特定属性的avg / mean / max为区域着色。 默认情况下，getColorValue返回points数组的长度。注意：六边形图层比较getColorValue是否已更改为重新计算其颜色所基于的每个bin的值。 您应该传递在render函数之外定义的函数，这样它就不会在每个渲染过程中创建一个新函数。
Parameters:
Name Type Description
points Array
Default Value:
  • points.length
Source:
View2D/Visuals/DeckGL/HexagonLayer.js
Returns:
count
Type
Int

getElevationValue(points)

与getColorValue类似，getElevationValue是获取bin高程所基于的值的访问器函数。 它将每个bin中的一组点作为参数，返回一个数字。 默认情况下，getElevationValue返回points数组的长度。注意：六边形图层比较getElevationValue是否已更改为重新计算每个bin的值以进行提升。 您应该传递在render函数之外定义的函数，这样它就不会在每个渲染过程中创建一个新函数。
Parameters:
Name Type Description
points Array
Default Value:
  • points.length
Source:
View2D/Visuals/DeckGL/HexagonLayer.js
Returns:
count
Type
Int

getInnerLayer()

获取deckgl内部layer实例
Source:
View2D/Visuals/DeckGL/HexagonLayer.js
Returns:
layer
Type
Object

getPosition(data)

位置GET属性
Parameters:
Name Type Description
data Feature geojson中的一个Feature
Default Value:
  • data.properties.coordinates
Source:
View2D/Visuals/DeckGL/HexagonLayer.js
Returns:
coordinates
Type
Array

onSetColorDomain()

计算bin颜色域时将调用此回调
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

onSetElevationDomain()

计算bin高程域时将调用此回调
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

remove()

从父对象中移除自己
Source:
View2D/Visuals/DeckGL/HexagonLayer.js

render()

绘制
Source:
View2D/Visuals/DeckGL/HexagonLayer.js