TrackLayer

GeoGlobe.Visuals.DeckGL. TrackLayer

基于DeckGL路径图层的轨迹图层

Constructor

new TrackLayer()

Author:
  • kz
Example
//构造地图对象
 var map = new GeoGlobe.Map({
	style: Cfg.style,
	container: 'map',
	zoom: 4.5,
	bearing: 27.2,
	pitch: 50,
	units: "degrees",
	center: [-0.244029, 51.517662]
 });
 //构造DeckGL可视化图层
 var deckgl = new GeoGlobe.Visuals.DeckGL();
 //绑定初始构建事件
 deckgl.on('overlayerinit', function(o){
    o.param.enable(o.param.DEPTH_TEST);
	o.param.depthFunc(o.param.LEQUAL);
 });
 //绑定鼠标点击事件
 deckgl.on('overlayerclick', function(e,a,b){

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

 });
 //添加到地图中
 deckgl.addTo(map);
 //构造轨迹图层
 var trackLayer = new GeoGlobe.Visuals.DeckGL.TrackLayer({
	id: 'track-layer',
	data: [
		{"type": "Feature", "properties": {"id": 10001, "name": "轨迹点1", "time": "2018-11-01 09:00"}, "geometry": {"type": "Point", "coordinates": [114.20257245367856, 30.073372078561778]}},
		{"type": "Feature", "properties": {"id": 10002, "name": "轨迹点2", "time": "2018-11-01 09:10"}, "geometry": {"type": "Point", "coordinates": [114.30257245367856, 30.673372078561778]}},
		{"type": "Feature", "properties": {"id": 10003, "name": "轨迹点3", "time": "2018-11-01 09:20"}, "geometry": {"type": "Point", "coordinates": [114.40257245367856, 30.273372078561778]}}
	],
	visible: true,
	pickable: true,
	fp64: false,
	opacity: 0.6,
	strokeWidth: 5,
	getColor: function (d) {
        if (d.properties.T === 0) {//不播放
            return [50, 50, 50];
        } else if (d.properties.T === 1) {//已播放
            return [200, 200, 200];
        } else if (d.properties.T === 2) {//待播放
            return [35, 152, 255];
        }
    }
 });
 //添加到DeckGL图层
 trackLayer.addTo(deckgl);
 //绘制
 deckgl.render();

Members

data :Array

geojson结构
Type:
  • Array
Example
[
   {"type": "Feature", "properties": {"id": 10001, "name": "轨迹点1", "time": "2018-11-01 09:00"}, "geometry": {"type": "Point", "coordinates": [114.20257245367856, 30.073372078561778]}},
   {"type": "Feature", "properties": {"id": 10002, "name": "轨迹点2", "time": "2018-11-01 09:10"}, "geometry": {"type": "Point", "coordinates": [114.30257245367856, 30.673372078561778]}},
   {"type": "Feature", "properties": {"id": 10003, "name": "轨迹点3", "time": "2018-11-01 09:20"}, "geometry": {"type": "Point", "coordinates": [114.40257245367856, 30.273372078561778]}}
]

fp64 :Boolean

Default Value:
  • true
是否开启高精度64位模式
Type:
  • Boolean

id :String

Default Value:
  • '1'
图层id
Type:
  • String

name :String

Default Value:
  • ''
图层名称
Type:
  • String

opacity :Number

Default Value:
  • 1
轨迹的不透明度
Type:
  • Number

pickable :Boolean

Default Value:
  • true
是否开启鼠标拾取
Type:
  • Boolean

rounded :Boolean

Default Value:
  • false
轨迹斜接处是否圆角
Type:
  • Boolean

visible :Boolean

Default Value:
  • true
可见性
Type:
  • Boolean

Methods

addTo(deckgl)

关联DeckGL
Parameters:
Name Type Description
deckgl GeoGlobe.Visuals.DeckGL

getColor(data) → {Array}

Default Value:
  • data.properties.color
单条线段颜色GET属性
Parameters:
Name Type Description
data Feature geojson中的一个Feature
Returns:
[0, 0, 0, 255]
Type
Array

getDashArray(data) → {Array}

Default Value:
  • [0, 0]
单条线段绘制为实线/虚线
Parameters:
Name Type Description
data Feature geojson中的一个Feature
Returns:
[0, 0]
Type
Array

getInnerLayer() → {Object}

获取deckgl内部layer实例
Returns:
layer
Type
Object

getPath(data) → {Array}

Default Value:
  • data.geometry.coordinates
单条轨迹线段GET属性
Parameters:
Name Type Description
data Feature geojson中的一个Feature
Returns:
Type
Array

getWidth(data) → {Number}

Default Value:
  • 1
单条线段宽度GET属性
Parameters:
Name Type Description
data Feature geojson中的一个Feature
Returns:
1
Type
Number

initialize(options)

构造函数
Parameters:
Name Type Description
options Object 参数对象

remove()

从父对象中移除自己

render()

绘制

setData(data)

更新轨迹数据
Parameters:
Name Type Description
data Array 轨迹数据

setRange(startTime, endTime)

设置轨迹的时间范围
Parameters:
Name Type Description
startTime Number 起始时间戳
endTime Number 终止时间戳