ScatterLayer

GeoGlobe.Visuals.EchartsGL. ScatterLayer

基于EchartsGL的三维散点图

Constructor

new ScatterLayer()

Author:
  • liuck
Example
//option参见:http://echarts.baidu.com/option-gl.html#series-scatter3D
 //构造EchartsGL可视化图层
 var echartsgl = new GeoGlobe.Visuals.EchartsGL({
	visualMap: {
		...
	},
	mapbox3D: {
		...
    }
});
 //构造3D散点图层
 var scatterLayer = new GeoGlobe.Visuals.EchartsGL.ScatterLayer({
	id: '3D scatter',
	name: '3D散点',
    data: [{
		"type": "Feature",
		"properties": {
			"id": 10001,
	 		"name": "1号点",
			"height": 1000
		},
		"geometry": {
			"type": "Point",
			"coordinates": [114.20257245367856, 30.773372078561778]
		}
	}],
    silent: true,
    animationEasingUpdate: 2000
});
 //添加到EchartsGL图层
 scatterLayer.addTo(echartsgl);
 //绘制
 echartsgl.render();

Members

animation :Boolean

Default Value:
  • true
是否开启动画
Type:
  • Boolean

animationDurationUpdate :Number

Default Value:
  • 500
过渡动画的时长
Type:
  • Number

animationEasingUpdate :String

Default Value:
  • 'cubicOut'
过渡动画的缓动效果
Type:
  • String

blendMode :String

Default Value:
  • 'source-over'
混合模式,目前支持'source-over','lighter',默认使用的'source-over'是通过 alpha 混合,而'lighter'是叠加模式,该模式可以让数据集中的区域因为叠加而产生高亮的效果。
Type:
  • String

(constant) coordinateSystem :String

Default Value:
  • 'mapbox3D'
图层使用的坐标系,为常量值,固定为'mapbox3D'
Type:
  • String

data :Array

三维散点图数据数组,geojson结构
Type:
  • Array
Example
[{
"type": "Feature",
"properties": {
		"id": 10001,
		"name": "1号点",
		"height": 1000
	},
"geometry": {
		"type": "Point",
		"coordinates": [114.20257245367856, 30.773372078561778]
	}
}]

emphasis :Object

Default Value:
  • null
图形和标签高亮的样式
Type:
  • Object
Example
{
	itemStyle : {
		...
	},
	label: {
		...
	}
}

id :String

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

itemStyle :Object

Default Value:
  • null
散点图颜色描边等样式
Type:
  • Object
Example
{
	color: [1, 1, 1, 1],
	opacity: 1,
	borderWidth: 0,
	borderColor: '#fff'
}

label :Object

Default Value:
  • null
标签样式
Type:
  • Object
Example
{
	show: false,
	distance: 5,
	position: 'right',
	formatter: ...
	textStyle: {
		color: '#fff',
		borderWidth: 1,
		borderColor: '#fff',
		fontFamily: 'sans-serif',
		fontSize: 20,
		fontWeight: normal
	}
}

name :String

Default Value:
  • ''
图层名称,用于tooltip的显示,legend 的图例筛选,在 setOption 更新数据和配置项时用于指定对应的系列。
Type:
  • String

silent :Boolean

Default Value:
  • false
图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。
Type:
  • Boolean

symbol :String

Default Value:
  • 'circle'
散点的形状。默认为圆形。ECharts提供的标记类型包括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow',可以通过 'path://' 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适(如果是 symbol 的话就是 symbolSize)的大小。路径的格式参见 SVG PathData。可以从 Adobe Illustrator 等工具编辑导出。
Type:
  • String

symbolSize :Number

Default Value:
  • 10
标记的大小,可以设置成诸如 10 这样单一的数字,也可以用数组分开表示宽和高,例如 [20, 10] 表示标记宽为20,高为10。
Type:
  • Number

(constant) type :String

Default Value:
  • 'scatter3D'
图层类别,为常量值,固定为'scatter3D'
Type:
  • String

zlevel :Number

Default Value:
  • -10
组件所在的层,zlevel 大的 Canvas 会放在 zlevel 小的 Canvas 的上面。
Type:
  • Number

Methods

addTo(echartsgl)

关联Three
Parameters:
Name Type Description
echartsgl GeoGlobe.Visuals.EchartsGL

getRenderOption() → {Object}

See:
获取绘制的option结构数据
Returns:
options
Type
Object

remove()

从父对象中移除自己

render()

绘制