docs: 文档图片居中 (#908)

* docs: 完善文档

* docs: 文档格式
This commit is contained in:
susiwen8 2021-12-31 16:01:16 +08:00 committed by GitHub
parent b2ef5d815d
commit 294142e936
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 45 additions and 31 deletions

View File

@ -54,14 +54,33 @@ layer.animatte({
time : 时间 毫秒 time : 时间 毫秒
```js ```js
import { CityBuildingLayer } from '@antv/l7'; import { CityBuildingLayer, Scene } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
style: 'dark',
center: [121.507674, 31.223043],
pitch: 65.59312320916906,
zoom: 15.4,
minZoom: 15,
maxZoom: 18,
}),
});
const buildingLayer = new CityBuildingLayer(); const buildingLayer = new CityBuildingLayer();
buildingLayer.animate(false); buildingLayer.animate(false);
setInterval(() => { let i = 0;
buildingLayer.setLight(Date.now()); function step() {
}, 2000); pointLayer.setLight(i++);
scene.render();
requestAnimationFrame(step);
}
scene.on('loaded', () => {
step();
});
``` ```
#### 完整代码 #### 完整代码

View File

@ -112,7 +112,7 @@ function step() {
mapService.rotateY({ mapService.rotateY({
option: { option: {
force: true, force: true,
reg: .1, reg: 0.1,
}, },
}); });
requestAnimationFrame(step); requestAnimationFrame(step);
@ -120,7 +120,7 @@ function step() {
scene.on('loaded', () => { scene.on('loaded', () => {
scene.addLayer(earthlayer); scene.addLayer(earthlayer);
requestAnimationFrame(step); step();
}); });
``` ```
@ -171,7 +171,7 @@ const earthlayer = new EarthLayer()
}); });
``` ```
<img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*i_TBRZRLSuYAAAAAAAAAAAAAARQnAQ" alt="L7 地球图层" width="300" height="300"> <img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*i_TBRZRLSuYAAAAAAAAAAAAAARQnAQ" style="display: block; margin: 0 auto" alt="L7 地球图层" width="300" height="300">
### 地球内发光/大气图层 atomLayer ### 地球内发光/大气图层 atomLayer
@ -187,7 +187,7 @@ const atomLayer = new EarthLayer()
}); });
``` ```
<img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*1MU_RZQyFTkAAAAAAAAAAAAAARQnAQ" alt="L7 地球图层大气效果" width="300" height="300" > <img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*1MU_RZQyFTkAAAAAAAAAAAAAARQnAQ" style="display: block; margin: 0 auto" alt="L7 地球图层大气效果" width="300" height="300" >
### 地球内外发光/辉光图层 bloomLayer ### 地球内外发光/辉光图层 bloomLayer
@ -202,4 +202,4 @@ const bloomLayer = new EarthLayer()
}); });
``` ```
<img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*FTniTZOZkNUAAAAAAAAAAAAAARQnAQ" alt="L7 地球图层辉光效果" width="300" height="300" > <img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*FTniTZOZkNUAAAAAAAAAAAAAARQnAQ" style="display: block; margin: 0 auto" alt="L7 地球图层辉光效果" width="300" height="300" >

View File

@ -9,7 +9,7 @@ order: 3
用户在地球模式下使用飞线图层无需做额外的操作L7 会自动识别地球模式并相关的转化 用户在地球模式下使用飞线图层无需做额外的操作L7 会自动识别地球模式并相关的转化
<img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*4ZCnQaH_nLIAAAAAAAAAAAAAARQnAQ" alt="L7地球飞线图层" width="300" height="300"> <img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*4ZCnQaH_nLIAAAAAAAAAAAAAARQnAQ" style="display: block; margin: 0 auto" alt="L7地球飞线图层" width="300" height="300">
## 使用 ## 使用

View File

@ -11,7 +11,7 @@ order: 3
## 示例图片 ## 示例图片
<img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*ck1XSZ4Vw0QAAAAAAAAAAAAAARQnAQ" alt="L7 地球点图层" width="300" height="300" > <img src="https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*ck1XSZ4Vw0QAAAAAAAAAAAAAARQnAQ" style="display: block; margin: 0 auto" alt="L7 地球点图层" width="300" height="300" >
## 使用 ## 使用

View File

@ -5,9 +5,9 @@ order: 5
`markdown:docs/common/style.md` `markdown:docs/common/style.md`
Raster 图层主要实现栅格数据的可视化,栅格数据主要来源是卫星遥感数据,如数字高程图,植被分布图,夜光图。 `RasterLayer` 图层主要实现栅格数据的可视化,栅格数据主要来源是卫星遥感数据,如数字高程图,植被分布图,夜光图。
L7 本身内部没有提供栅格数据格式 如 tiff,需要外部解析好做为 Source 传入。 L7 本身内部没有提供栅格数据格式 如 `tiff`,需要外部解析好做为 `Source` 传入。
## 使用 ## 使用
@ -21,26 +21,21 @@ import { RasterLayer } from '@antv/l7';
## shape ## shape
`raster` 仅支持 `raster`
## size
## color
## style ## style
- clampLow Boolean 默认 false, 设置为 true低于 domain 的数据将不显示 - `clampLow`: `Boolean` 默认 false, 设置为 true低于 domain 的数据将不显示
- clampHigh Boolean 默认 false, 设置为 true高于 domain 的数据将不显示 - `clampHigh`: `Boolean` 默认 false, 设置为 true高于 domain 的数据将不显示
- opacity: 0.8 Number 透明度 - `opacity`: `Number`, 默认值为 0.8 透明度
- domain: [ 0, 8000 ] 数据映射区间 - `domain`: [ 0, 8000 ] 数据映射区间
- noDataValue Number noDataValue 不会显示 - `noDataValue` `Number` noDataValue 不会显示
- rampColors: { - `rampColors`: {
colors: [ '#FF4818', '#F7B74A', '#FFF598', '#91EABC', '#2EA9A1', '#206C7C' ],
positions: [ 0, 0.2, 0.4, 0.6, 0.8, 1.0 ] `colors`: [ '#FF4818', '#F7B74A', '#FFF598', '#91EABC', '#2EA9A1', '#206C7C' ],
`positions`: [ 0, 0.2, 0.4, 0.6, 0.8, 1.0 ]
} // 色带 } // 色带
⚠️ color, position 的长度要相同 ⚠️ `color`, `position` 的长度要相同