docs: add source docs, fix mapbox marker

docs/api/layer/pointlayer.zh.md

@@ -25,6 +25,14 @@ shape 支持
 
 ```
 
+## source
+
+点数据类型，根据经纬点绘制图形,目前支持三种数据结构
+
+- [GeoJOSN]('../source/geojson/#point')
+- [CSV]()
+- [JSON](../source/json/#点数据)
+
 **图片标注**
 
 通过 `Scene.addImage()` 可以添加图片资源，

docs/api/source/csv.en.md

@@ -0,0 +1,53 @@
+---
+title: CSV
+order: 3
+---
+
+L7 支持 CSV 以逗号分隔的 CSV 数据加载。
+
+CSV 是文本数据结构，很难表达复杂的地理数据结构，因此 CSV 仅支持两种数据结构
+
+- 点数据 需要指定经度，纬度坐标
+- 线段，弧线数据 需要指定 起始点的 经度，纬度坐标
+
+## parser
+
+- type string 必选 json
+- x string 点数据表示 经度
+- y string 点数据表示 纬度
+- x1 string 经度
+- x2 string 纬度
+
+### 点数据通过 CSV 加载
+
+```javascript
+layer.source(data, {
+  parser: {
+    type: 'csv',
+    x: 'lng',
+    y: 'lat',
+  },
+});
+```
+
+[CSV 数据 demo 示例](../../../examples/point/bubble#scatter)
+
+### 线段弧线数据通过 CSV 加载
+
+```javascript
+layer.source(
+  data,
+   {
+    parser:{
+        type:'csv',
+        x:'lng1',
+        y:'lat1' ,
+        x1:'lng1',
+        y1:'lat2' ,
+    }
+  }
+})
+
+```
+
+[CSV 线段数据 demo 示例](../../../examples/gallery/basic#arcCircle)

docs/api/source/csv.zh.md

@@ -0,0 +1,53 @@
+---
+title: CSV
+order: 3
+---
+
+L7 支持 CSV 以逗号分隔的 CSV 数据加载。
+
+CSV 是文本数据结构，很难表达复杂的地理数据结构，因此 CSV 仅支持两种数据结构
+
+- 点数据 需要指定经度，纬度坐标
+- 线段，弧线数据 需要指定 起始点的 经度，纬度坐标
+
+## parser
+
+- type string 必选 json
+- x string 点数据表示 经度
+- y string 点数据表示 纬度
+- x1 string 经度
+- x2 string 纬度
+
+### 点数据通过 CSV 加载
+
+```javascript
+layer.source(data, {
+  parser: {
+    type: 'csv',
+    x: 'lng',
+    y: 'lat',
+  },
+});
+```
+
+[CSV 数据 demo 示例](../../../examples/point/bubble#scatter)
+
+### 线段弧线数据通过 CSV 加载
+
+```javascript
+layer.source(
+  data,
+   {
+    parser:{
+        type:'csv',
+        x:'lng1',
+        y:'lat1' ,
+        x1:'lng1',
+        y1:'lat2' ,
+    }
+  }
+})
+
+```
+
+[CSV 线段数据 demo 示例](../../../examples/gallery/basic#arcCircle)

docs/api/source/image.en.md

@@ -0,0 +1,25 @@
+---
+title: Image
+order: 4
+---
+
+Image 数据主要用于在地图根据经纬度范围添加图图片，不如一幅纸制地图扫描版你要放在地图显示。
+
+## parser
+
+- type: image
+- extent: 图像的经纬度范围 [minlng, minlat,maxLng, maxLat]
+
+根据图片的经纬度范围，将图片添加到地图上。
+
+```javascript
+layer.source(
+  'https://gw.alipayobjects.com/zos/rmsportal/FnHFeFklTzKDdUESRNDv.jpg',
+  {
+    parser: {
+      type: 'image',
+      extent: [121.168, 30.2828, 121.384, 30.4219],
+    },
+  },
+);
+```

docs/api/source/image.zh.md

@@ -0,0 +1,25 @@
+---
+title: Image
+order: 4
+---
+
+Image 数据主要用于在地图根据经纬度范围添加图图片，不如一幅纸制地图扫描版你要放在地图显示。
+
+## parser
+
+- type: image
+- extent: 图像的经纬度范围 [minlng, minlat,maxLng, maxLat]
+
+根据图片的经纬度范围，将图片添加到地图上。
+
+```javascript
+layer.source(
+  'https://gw.alipayobjects.com/zos/rmsportal/FnHFeFklTzKDdUESRNDv.jpg',
+  {
+    parser: {
+      type: 'image',
+      extent: [121.168, 30.2828, 121.384, 30.4219],
+    },
+  },
+);
+```

docs/api/source/json.en.md

@@ -1,6 +1,6 @@
 ---
 title: JSON
-order: 1
+order: 2
 ---
 
 GeoJSON 虽然是通用的的地理数据格式，在具体使用场景中，数据服务人员可能并不熟悉 GeoJON,或者没有生成 GeoJON 的工具， 因此 L7 对数据定义了 Parser 的概念，你的数据可以是任何格式，使用指定数据对应的地理信息字段即可。

docs/api/source/json.zh.md

@@ -1,6 +1,6 @@
 ---
 title: JSON
-order: 1
+order: 2
 ---
 
 GeoJSON 虽然是通用的的地理数据格式，在具体使用场景中，数据服务人员可能并不熟悉 GeoJON,或者没有生成 GeoJON 的工具， 因此 L7 对数据定义了 Parser 的概念，你的数据可以是任何格式，使用指定数据对应的地理信息字段即可。
@@ -39,6 +39,8 @@ layer.source(data, {
 });
 ```
 
+[JOSN 数据 demo 示例](../../../examples/gallery/basic)
+
 ### 通用解析方式
 
 可也解析任意复杂的点，线面

docs/api/source/source.en.md

@@ -40,100 +40,25 @@ layer.source(data);
 
 #### JSON
 
-[JSON 数据格式解析](../json)
+[JSON 数据格式解析](./json)
 
 #### csv
 
-点，线数据配置项同 json 数据类型
+[CSV 数据格式解析](./csv)
 
-```javascript
-layer.source(data, {
-  parser: {
-    type: 'csv',
-    x: 'lng1',
-    y: 'lat1',
-    x1: 'lng1',
-    y1: 'lat2',
-  },
-});
-```
-
-**栅格数据类型 **
+栅格数据类型
 
 #### image
 
-根据图片的经纬度范围，将图片添加到地图上。  配置项
-
-- type: image
-- extent: 图像的经纬度范围 []
-
-```javascript
-layer.source(
-  'https://gw.alipayobjects.com/zos/rmsportal/FnHFeFklTzKDdUESRNDv.jpg',
-  {
-    parser: {
-      type: 'image',
-      extent: [121.168, 30.2828, 121.384, 30.4219],
-    },
-  },
-);
-```
-
-#### raster
-
-栅格数据类型，主要表示遥感数据类型 data 栅格数据的二维矩阵数据 parser 配置项
-
-- type  raster
-- width  数据宽度二维矩阵 columns
-- height 数据高度
-- min 数据最大值
-- max 数据最小值
-- extent 经纬度范围
-
-```javascript
-source(values, {
-  parser: {
-    type: 'raster',
-    width: n,
-    height: m,
-    min: 0,
-    max: 8000,
-    extent: [73.482190241, 3.82501784112, 135.106618732, 57.6300459963],
-  },
-});
-```
+[Image 数据格式解析](./image)
 
 ### transforms
 
-目前支持三种数据处理方法 map，grid，hexagon transform 配置项
+目前支持两种热力图使用的数据处理方法 grid，hexagon transform 配置项
 
 - type 数据处理类型
 - tansform cfg  数据处理配置项
 
-#### map
-
-数据处理，支持自定义 callback 函数
-
-- callback:function 回调函数
-
-```javascript
-layer.source(data, {
-  transforms: [
-    {
-      type: 'map',
-      callback: function(item) {
-        const [x, y] = item.coordinates;
-        item.lat = item.lat * 1;
-        item.lng = item.lng * 1;
-        item.v = item.v * 1;
-        item.coordinates = [x * 1, y * 1];
-        return item;
-      },
-    },
-  ],
-});
-```
-
 #### grid
 
 生成方格网布局，根据数据字段统计，主要在网格热力图中使用
@@ -163,4 +88,4 @@ layer.source(data, {
 - type: 'hexagon',
 - size: 网格半径
 - field: 数据统计字段
-- method:聚合方法   count,max,min,sum,mean5 个统计维度
+- method:聚合方法   count,max,min,sum,mean 5 个统计维度