p90524618
/
antv-l7
mirror of https://gitee.com/antv-l7/antv-l7
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge branch 'master' of https://github.com/antvis/L7

This commit is contained in:
shihui 2022-01-06 14:34:58 +08:00
parent 6fba8f3f20 06fedca833
commit f9aa0ef829
3 changed files with 33 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
docs/api/earth/earth.zh.md
View File

@ -20,12 +20,19 @@ import { Earth } from '@antv/l7-maps';
### 点图层
- 平面点: `shape: 'circle'`
- 圆柱点: `shape: 'cylinder'`
**平面点: circle**
<img width="60%" style="display: block;margin: 0 auto;" alt="案例" src='https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*PD6fTbs7E3gAAAAAAAAAAAAAARQnAQ'>
**圆柱点: cylinder**
<img width="60%" style="display: block;margin: 0 auto;" alt="案例" src='https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*n6tYQKceveUAAAAAAAAAAAAAARQnAQ'>
### 线图层
- 3D 弧线: `shape: 'arc3d'`
**3D 弧线: arc3d**
<img width="60%" style="display: block;margin: 0 auto;" alt="案例" src='https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*FjhGT77aCaIAAAAAAAAAAAAAARQnAQ'>
## 使用
@ -79,7 +86,7 @@ scene.on('loaded', () => {
作为 l7-maps 的基础地图类型，`Earth` 提供了地球系统的相机系统，目前只需要传入一个空对象。
- args: {}
- args: **{}**
```js
import { Scene, Earth } from '@antv/l7-maps';

60
docs/api/earth/flyline.zh.md
View File

@ -5,56 +5,24 @@ order: 3
`markdown:docs/common/style.md`
## 简介
用户在地球模式下使用飞线图层无需做额外的操作，L7 会自动识别地球模式并相关的转化
<img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*4ZCnQaH_nLIAAAAAAAAAAAAAARQnAQ" style="display: block; margin: 0 auto" alt="L7地球飞线图层" width="60%">
## 使用
地球飞线图通过 `LineLayer` 和 `EarthLayer` 实例化
```javascript
import { Scene, EarthLayer, LineLayer } from '@antv/l7';
import { Earth } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Earth({}),
});
const flydata = [
{
coord: [
[104.195397, 35.86166],
[100.992541, 15.870032],
],
},
];
const flyLine = new LineLayer({ blend: 'normal' })
.source(flydata, {
parser: {
type: 'json',
coordinates: 'coord',
},
})
.color('#b97feb')
.shape('arc3d')
.size(0.5);
const earthlayer = new EarthLayer()
.source(
'https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*3-3NSpqRqUoAAAAAAAAAAAAAARQnAQ',
{
parser: {
type: 'image',
},
},
)
.color('#2E8AE6')
.shape('base');
scene.on('loaded', () => {
scene.addLayer(earthlayer);
scene.addLayer(flyLine);
earthlayer.setEarthTime(4.0);
});
import { EarthLayer, LineLayer } from '@antv/l7';
```
<img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*4ZCnQaH_nLIAAAAAAAAAAAAAARQnAQ" style="display: block; margin: 0 auto" alt="L7地球飞线图层" width="60%">
### shape
地球飞线图层 shape 只支持 **arc3d**
### 其他配置
剩下的配置和[线图层](../line_layer/linelayer)一致
[在线案例](../../../examples/earth/arc3d#flyline)

55
docs/api/earth/point.zh.md
View File

@ -5,56 +5,17 @@ order: 3
`markdown:docs/common/style.md`
## 简介
用户在地球模式下使用点图层无需做额外的操作，L7 会自动识别地球模式并相关的转化
## 示例图片
<img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*ck1XSZ4Vw0QAAAAAAAAAAAAAARQnAQ" style="display: block; margin: 0 auto" alt="L7 地球点图层" width="60%" >
## 使用
地球点图层通过 `PointLayer` 和 `EarthLayer` 实例化
```javascript
import { Scene, PointLayer, EarthLayer } from '@antv/l7';
import { Earth } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Earth({}),
});
const d = [{ lng: 121.61865234375, lat: 25.29437116258816 }];
const pointlayer = new PointLayer()
.source(d, {
parser: {
type: 'json',
x: 'lng',
y: 'lat',
},
})
.shape('circle')
.color('#f00')
.size(10)
.active(true);
const earthlayer = new EarthLayer()
.source(
'https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*3-3NSpqRqUoAAAAAAAAAAAAAARQnAQ',
{
parser: {
type: 'image',
},
},
)
.style({
globelOtions: {
ambientRatio: 1, // 环境光
},
});
scene.on('loaded', () => {
scene.addLayer(earthlayer);
scene.addLayer(pointlayer);
});
import { PointLayer, EarthLayer } from '@antv/l7';
```
<img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*ck1XSZ4Vw0QAAAAAAAAAAAAAARQnAQ" style="display: block; margin: 0 auto" alt="L7 地球点图层" width="60%" >
[在线案例](../../../examples/earth/point#point)
### 配置项
和 [`PontLayer`](../point_layer/pointlayer) 一致