GeoGlobe JS SDK

Class: ScatterplotLayer

.Visuals.DeckGL. ScatterplotLayer

基于DeckGL的散点图层

new ScatterplotLayer()

Author:
  • liuck
Source:
View2D/Visuals/DeckGL/ScatterplotLayer.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 scatterplotLayer = new GeoGlobe.Visuals.DeckGL.ScatterplotLayer({
	id: 'scatterplot-layer',
    data: [
    	{ "type": "Feature", "properties": { "id": 10001, "name": "散点1" }, "geometry": { "type": "Point", "coordinates": [114.20257245367856, 30.773372078561778] } }
	],
    visible: true,
    pickable: true,
    fp64: false,
    opacity: 0.8,
    radiusScale: 6,
    radiusMinPixels: 1,
    radiusMaxPixels: 100,
    getRadius: function(d){ return Math.random()*100 },
    getColor: function(d){ return [255, 140, 0] }
});
//添加到DeckGL图层
scatterplotLayer.addTo(deckgl);
//绘制
deckgl.render();

Members

data :Array

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

fp64 :Boolean

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

id :String

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

name :String

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

opacity :Float

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

outline :Boolean

是否只画点的轮廓
Type:
  • Boolean
Default Value:
  • false
Source:
View2D/Visuals/DeckGL/ScatterplotLayer.js

pickable :Boolean

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

radiusMaxPixels :Int

像素的最大半径。
Type:
  • Int
Default Value:
  • Number.MAX_SAFE_INTEGER
Source:
View2D/Visuals/DeckGL/ScatterplotLayer.js

radiusMinPixels :Int

像素的最小半径。
Type:
  • Int
Default Value:
  • 0
Source:
View2D/Visuals/DeckGL/ScatterplotLayer.js

radiusScale :Int

半径倍数
Type:
  • Int
Default Value:
  • 1
Source:
View2D/Visuals/DeckGL/ScatterplotLayer.js

strokeWidth :Int

轮廓的宽度，以像素为单位。要求大纲是真实的。
Type:
  • Int
Default Value:
  • 1
Source:
View2D/Visuals/DeckGL/ScatterplotLayer.js

visible :Boolean

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

Methods

addTo(deckgl)

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

getColor(data)

RGBA每个对象的色系，在R，G，B [一]。每个分量在0到255的范围。
Parameters:
Name Type Description
data Object
Default Value:
  • [0, 0, 0, 255]
Source:
View2D/Visuals/DeckGL/ScatterplotLayer.js
Returns:
color
Type
Array

getInnerLayer()

获取deckgl内部layer实例
Source:
View2D/Visuals/DeckGL/ScatterplotLayer.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/ScatterplotLayer.js
Returns:
coordinates
Type
Array

getRadius(points)

半径，以米为单位。
Parameters:
Name Type Description
points Array
Default Value:
  • points.length
Source:
View2D/Visuals/DeckGL/ScatterplotLayer.js
Returns:
count
Type
Int

remove()

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

render()

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