Constructor
new MapLayer()
Example
//option参见:http://echarts.baidu.com/option-gl.html#series-map3D
//构造EchartsGL可视化图层
var echartsgl = new GeoGlobe.Visuals.EchartsGL({
visualMap: {
...
},
mapbox3D: {
...
}
});
//构造3D地图图层
var mapLayer = new GeoGlobe.Visuals.EchartsGL.MapLayer({
id: '3D map',
name: '3D地图',
data: [{
"type": "Feature",
"properties": {
"id": 10001,
"name": "1号",
"height": 1000
},
"geometry": {
"type": "Polygon",
"coordinates": [[[114.26730001377071,30.595149654035424],[114.26737510423808,30.594983416111138],[114.26728930608508,30.594946561374197],[114.26731076201405,30.59488191979089],[114.26717133751096,30.594845110133267],[114.26709624642238,30.59501134779343],[114.26717132160428,30.595029748326304],[114.26713914030533,30.595094398742066],[114.26707478473918,30.59514061236826],[114.26699970846724,30.59513144350006],[114.26698898951582,30.59505759734068],[114.26678520845394,30.595048535449614],[114.26677447111632,30.595187022721653],[114.26687099882221,30.59519617428873],[114.26687099245959,30.595270029320062],[114.26707477280914,30.595279090587976],[114.26730001377071,30.595149654035424]]]
}
}],
silent: true,
animationEasingUpdate: 2000
});
//添加到EchartsGL图层
mapLayer.addTo(echartsgl);
//绘制
echartsgl.render();
Members
(constant) coordinateSystem :String
- Default Value:
- 'mapbox3D'
图层使用的坐标系,为常量值,固定为'mapbox3D'
Type:
- String
data :Array
地图区域的设置。geojson结构
Type:
- Array
Example
[{
"type": "Feature",
"properties": {
"id": 10001,
"name": "1号多边形",
"height": 3
},
"geometry": {
"type": "Polygon",
"coordinates": [[[114.26730001377071,30.595149654035424],[114.26737510423808,30.594983416111138],[114.26728930608508,30.594946561374197],[114.26731076201405,30.59488191979089],[114.26717133751096,30.594845110133267],[114.26709624642238,30.59501134779343],[114.26717132160428,30.595029748326304],[114.26713914030533,30.595094398742066],[114.26707478473918,30.59514061236826],[114.26699970846724,30.59513144350006],[114.26698898951582,30.59505759734068],[114.26678520845394,30.595048535449614],[114.26677447111632,30.595187022721653],[114.26687099882221,30.59519617428873],[114.26687099245959,30.595270029320062],[114.26707477280914,30.595279090587976],[114.26730001377071,30.595149654035424]]]
}
}]
id :String
- Default Value:
- '1'
图层id
Type:
- String
instancing :Boolean
- Default Value:
- false
会将 GeoJSON 中所有的 geometry 合并成一个,在 GeoJSON 拥有特别多(上千)的 geometry 时可以有效提升绘制效率。
Type:
- Boolean
itemStyle :Object
- Default Value:
- null
三维地图 中三维图形的视觉属性,包括颜色,透明度,描边等。
Type:
- Object
Example
{
color: [1, 1, 1, 1],
opacity: 1,
borderWidth: 1,
borderColor: '#333'
}
label :Object
- Default Value:
- null
标签的相关设置
Type:
- Object
Example
{
show: false,
distance: 10,
formatter: '{b}: {c}',
textStyle: {...}
}
light :Object
- Default Value:
- null
光照相关的设置。在 shading 为 'color' 的时候无效。光照的设置会影响到组件以及组件所在坐标系上的所有图表。合理的光照设置能够让整个场景的明暗变得更丰富,更有层次。
Type:
- Object
Example
{
main: {...},
ambient: {...},
ambientCubemap: {...},
}
map :String
- Default Value:
- ''
地图类型。ECharts 中提供了两种格式的地图数据,一种是可以直接 script 标签引入的 js 文件,引入后会自动注册地图名字和数据。还有一种是 JSON 文件,需要通过 AJAX 异步加载后手动注册。
Type:
- String
name :String
- Default Value:
- ''
图层名称,用于tooltip的显示,legend 的图例筛选,在 setOption 更新数据和配置项时用于指定对应的系列。
Type:
- String
postEffect :Object
- Default Value:
- null
后处理特效的相关配置,后处理特效可以为画面添加高光,景深,环境光遮蔽(SSAO),调色等效果。可以让整个画面更富有质感。
Type:
- Object
Example
{
enable: false,
bloom: {...},
depthOfField: {...},
screenSpaceAmbientOcclusion: {...},
SSAO: {...},
colorCorrection: {...},
FXAA: {...}
}
shading :String
- Default Value:
- null
三维地图中三维图形的着色效果。支持下面三种着色方式,'color' 只显示颜色,不受光照等其它因素的影响。'lambert' 通过经典的 lambert 着色表现光照带来的明暗。'realistic' 真实感渲染,配合 light.ambientCubemap 和 postEffect 使用可以让展示的画面效果和质感有质的提升。
Type:
- String
temporalSuperSampling :Object
- Default Value:
- null
分帧超采样。在开启 postEffect 后,WebGL 默认的 MSAA 会无法使用,所以我们需要自己解决锯齿的问题。分帧超采样就是用来解决锯齿的问题,它在画面静止后会持续分帧对一个像素多次抖动采样,从而达到抗锯齿的效果。而且在这个分帧采样的过程中,echarts-gl 也会对 postEffect 中一些需要采样保证效果的特效,例如 SSAO, 景深,以及阴影进行渐进增强。
Type:
- Object
Example
{
enable: 'auto'
}
(constant) type :String
- Default Value:
- 'map3D'
图层类别,为常量值,固定为'map3D'
Type:
- String
Methods
addTo(echartsgl)
关联Three
Parameters:
Name | Type | Description |
---|---|---|
echartsgl |
GeoGlobe.Visuals.EchartsGL |
getRenderOption() → {Object}
获取绘制的option结构数据
Returns:
options
- Type
- Object
remove()
从父对象中移除自己
render()
绘制