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

* docs: 完善文档

* docs: 文档格式

docs/api/cityBuilding/cityBuilding.zh.md

@@ -54,14 +54,33 @@ layer.animatte({
 time : 时间 毫秒
 
 ```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();
 buildingLayer.animate(false);
 
-setInterval(() => {
-  buildingLayer.setLight(Date.now());
-}, 2000);
+let i = 0;
+function step() {
+  pointLayer.setLight(i++);
+  scene.render();
+  requestAnimationFrame(step);
+}
+
+scene.on('loaded', () => {
+  step();
+});
 ```
 
 #### 完整代码

docs/api/earth/earth.zh.md

@@ -112,7 +112,7 @@ function step() {
   mapService.rotateY({
     option: {
       force: true,
-      reg: .1,
+      reg: 0.1,
     },
   });
   requestAnimationFrame(step);
@@ -120,7 +120,7 @@ function step() {
 
 scene.on('loaded', () => {
   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
 
@@ -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
 
@@ -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" >

docs/api/earth/flyline.zh.md

@@ -9,7 +9,7 @@ order: 3
 
 用户在地球模式下使用飞线图层无需做额外的操作，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">
 
 ## 使用
 

docs/api/earth/point.zh.md

@@ -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" >
 
 ## 使用
 

docs/api/raster/raster_layer.zh.md

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