mirror of https://gitee.com/antv-l7/antv-l7
chore: publish (#1497)
* chore: publish * fix: update dumi-theme-antv version * docs: raster 文档 * fix: docs 样式 * docs: lint * docs: lint * docs: 官网配置 * fix: geojson vt * fix: 更新dumi 配置 * fix: 更新文档 * docs: 文档
This commit is contained in:
@thinkinggis
GitHub
parent
7becddd82f
commit
4a1ba616b3
|
|
@ -95,7 +95,7 @@ export default defineConfig({
|
|||
'https://gw.alipayobjects.com/os/lib/antd/4.19.4/dist/antd.js',
|
||||
/** lodash */
|
||||
'https://gw.alipayobjects.com/os/lib/lodash/4.17.20/lodash.min.js',
|
||||
],
|
||||
]
|
||||
|
||||
// more config: https://d.umijs.org/config
|
||||
});
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
"registry": "https://registry.npmjs.org"
|
||||
}
|
||||
},
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"npmClient": "yarn",
|
||||
"useWorkspaces": true,
|
||||
"publishConfig": {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-component",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
@ -26,8 +26,8 @@
|
|||
"author": "lzxue",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/l7-core": "2.11.0",
|
||||
"@antv/l7-utils": "2.11.0",
|
||||
"@antv/l7-core": "2.11.1",
|
||||
"@antv/l7-utils": "2.11.1",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"eventemitter3": "^4.0.0",
|
||||
"inversify": "^5.0.1",
|
||||
|
|
@ -36,7 +36,7 @@
|
|||
"supercluster": "^7.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@antv/l7-test-utils": "2.11.0",
|
||||
"@antv/l7-test-utils": "2.11.1",
|
||||
"gcoord": "^0.3.2",
|
||||
"less": "^4.1.3"
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-core",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
@ -25,7 +25,7 @@
|
|||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/async-hook": "^2.2.9",
|
||||
"@antv/l7-utils": "2.11.0",
|
||||
"@antv/l7-utils": "2.11.1",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@turf/helpers": "^6.1.4",
|
||||
"ajv": "^6.10.2",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "A Large-scale WebGL-powered Geospatial Data Visualization",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
@ -26,13 +26,13 @@
|
|||
"author": "antv",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@antv/l7-component": "2.11.0",
|
||||
"@antv/l7-core": "2.11.0",
|
||||
"@antv/l7-layers": "2.11.0",
|
||||
"@antv/l7-maps": "2.11.0",
|
||||
"@antv/l7-scene": "2.11.0",
|
||||
"@antv/l7-source": "2.11.0",
|
||||
"@antv/l7-utils": "2.11.0",
|
||||
"@antv/l7-component": "2.11.1",
|
||||
"@antv/l7-core": "2.11.1",
|
||||
"@antv/l7-layers": "2.11.1",
|
||||
"@antv/l7-maps": "2.11.1",
|
||||
"@antv/l7-scene": "2.11.1",
|
||||
"@antv/l7-source": "2.11.1",
|
||||
"@antv/l7-utils": "2.11.1",
|
||||
"@babel/runtime": "^7.7.7"
|
||||
},
|
||||
"gitHead": "684ba4eb806a798713496d3fc0b4d1e17517dc31",
|
||||
|
|
|
|||
|
|
@ -1,2 +1,2 @@
|
|||
const version = '2.11.0';
|
||||
const version = '2.11.1';
|
||||
export { version };
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-layers",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "L7's collection of built-in layers",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
@ -27,10 +27,10 @@
|
|||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/async-hook": "^2.2.9",
|
||||
"@antv/l7-core": "2.11.0",
|
||||
"@antv/l7-maps": "2.11.0",
|
||||
"@antv/l7-source": "2.11.0",
|
||||
"@antv/l7-utils": "2.11.0",
|
||||
"@antv/l7-core": "2.11.1",
|
||||
"@antv/l7-maps": "2.11.1",
|
||||
"@antv/l7-source": "2.11.1",
|
||||
"@antv/l7-utils": "2.11.1",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@mapbox/martini": "^0.2.0",
|
||||
"@turf/clone": "^6.5.0",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-map",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "l7 map",
|
||||
"keywords": [],
|
||||
"author": "thinkinggis <lzx199065@gmail.com>",
|
||||
|
|
@ -39,7 +39,7 @@
|
|||
},
|
||||
"homepage": "https://github.com/antvis/L7#readme",
|
||||
"dependencies": {
|
||||
"@antv/l7-utils": "2.11.0",
|
||||
"@antv/l7-utils": "2.11.1",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@mapbox/point-geometry": "^0.1.0",
|
||||
"@mapbox/unitbezier": "^0.0.0",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-maps",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
@ -27,9 +27,9 @@
|
|||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@amap/amap-jsapi-loader": "^1.0.1",
|
||||
"@antv/l7-core": "2.11.0",
|
||||
"@antv/l7-map": "2.11.0",
|
||||
"@antv/l7-utils": "2.11.0",
|
||||
"@antv/l7-core": "2.11.1",
|
||||
"@antv/l7-map": "2.11.1",
|
||||
"@antv/l7-utils": "2.11.1",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@types/amap-js-api": "^1.4.6",
|
||||
"@types/mapbox-gl": "^1.11.2",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-mini",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "A Large-scale WebGL-powered Geospatial Data Visualization",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
@ -25,11 +25,11 @@
|
|||
"author": "antv",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@antv/l7-core": "2.11.0",
|
||||
"@antv/l7-layers": "2.11.0",
|
||||
"@antv/l7-maps": "2.11.0",
|
||||
"@antv/l7-scene": "2.11.0",
|
||||
"@antv/l7-utils": "2.11.0",
|
||||
"@antv/l7-core": "2.11.1",
|
||||
"@antv/l7-layers": "2.11.1",
|
||||
"@antv/l7-maps": "2.11.1",
|
||||
"@antv/l7-scene": "2.11.1",
|
||||
"@antv/l7-utils": "2.11.1",
|
||||
"@babel/runtime": "^7.7.7"
|
||||
},
|
||||
"gitHead": "684ba4eb806a798713496d3fc0b4d1e17517dc31",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-renderer",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
@ -25,12 +25,12 @@
|
|||
"author": "xiaoiver",
|
||||
"license": "ISC",
|
||||
"devDependencies": {
|
||||
"@antv/l7-test-utils": "2.11.0",
|
||||
"@antv/l7-test-utils": "2.11.1",
|
||||
"gl": "^5.0.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"@antv/l7-core": "2.11.0",
|
||||
"@antv/l7-utils": "2.11.0",
|
||||
"@antv/l7-core": "2.11.1",
|
||||
"@antv/l7-utils": "2.11.1",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"inversify": "^5.0.1",
|
||||
"l7regl": "^0.0.20",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-scene",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
@ -23,12 +23,12 @@
|
|||
"author": "xiaoiver",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/l7-component": "2.11.0",
|
||||
"@antv/l7-core": "2.11.0",
|
||||
"@antv/l7-layers": "2.11.0",
|
||||
"@antv/l7-maps": "2.11.0",
|
||||
"@antv/l7-renderer": "2.11.0",
|
||||
"@antv/l7-utils": "2.11.0",
|
||||
"@antv/l7-component": "2.11.1",
|
||||
"@antv/l7-core": "2.11.1",
|
||||
"@antv/l7-layers": "2.11.1",
|
||||
"@antv/l7-maps": "2.11.1",
|
||||
"@antv/l7-renderer": "2.11.1",
|
||||
"@antv/l7-utils": "2.11.1",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"eventemitter3": "^4.0.7",
|
||||
"inversify": "^5.0.1",
|
||||
|
|
@ -36,7 +36,7 @@
|
|||
"reflect-metadata": "^0.1.13"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@antv/l7-test-utils": "2.11.0"
|
||||
"@antv/l7-test-utils": "2.11.1"
|
||||
},
|
||||
"gitHead": "684ba4eb806a798713496d3fc0b4d1e17517dc31",
|
||||
"publishConfig": {
|
||||
|
|
|
|||
|
|
@ -199,7 +199,7 @@ export default defineConfig({
|
|||
},
|
||||
{
|
||||
name: {
|
||||
zh: 'L7 地理围栏绘制组件库',
|
||||
zh: 'L7Draw 地理围栏绘制组件库',
|
||||
en: 'L7Draw',
|
||||
},
|
||||
url: 'http://antv.vision/L7Draw/',
|
||||
|
|
@ -606,6 +606,13 @@ export default defineConfig({
|
|||
scripts: [
|
||||
'https://webapi.amap.com/maps?v=2.0&key=ff533602d57df6f8ab3b0fea226ae52f'
|
||||
],
|
||||
internalSite: {
|
||||
url: 'https://s2.antv.antgroup.com',
|
||||
name: {
|
||||
zh: '国内镜像',
|
||||
en: 'China Mirror',
|
||||
},
|
||||
},
|
||||
alias: env === 'development'? {
|
||||
'@antv/l7': path.resolve(__dirname, '../l7/src'),
|
||||
'@antv/l7-mini': path.resolve(__dirname, '../mini/src'),
|
||||
|
|
|
|||
|
|
@ -1,14 +1,6 @@
|
|||
---
|
||||
title: Style
|
||||
order: 4
|
||||
---
|
||||
|
||||
<embed src="@/docs/common/style.md"></embed>
|
||||
|
||||
`style` 方法用于配制图层的样式，栅格图层在绘制单通道的栅格和多通道的栅格时拥有不同的 `style` 参数。
|
||||
|
||||
`style` 方法用于配制图层的样式，
|
||||
- 单通道 绘制结果由是单一的数值控制，如灰度图，数值对应的颜色可以通过表示配置 `rampColors` 色带控制。
|
||||
- 多通道 绘制结果由 `r`、`g`、`b` 三个通道的数值控制，波段计算返回结果直接作为 `sRGB` 的颜色。
|
||||
|
||||
```js
|
||||
layer.style({
|
||||
|
|
@ -16,7 +8,7 @@ layer.style({
|
|||
});
|
||||
```
|
||||
|
||||
### raster 单通道栅格
|
||||
### 配置
|
||||
|
||||
| style | 类型 | 描述 | 默认值 |
|
||||
| ----------- | ------------------ | ------------------------------------------- | ------------- |
|
||||
|
|
@ -44,11 +36,3 @@ layer.style({
|
|||
},
|
||||
});
|
||||
```
|
||||
|
||||
### raster 多通道栅格
|
||||
|
||||
当我们使用栅格图层绘制彩色遥感影像的时候，`style` 支持参数只有 `opacity`。不再根据 `rampColors` 色带取值，而是根据 `rgb` 通道的波段数据作为颜色值。
|
||||
|
||||
| style | 类型 | 描述 | 默认值 |
|
||||
| ------- | -------- | ------------ | ------ |
|
||||
| opacity | `number` | 图形的透明度 | `1` |
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
---
|
||||
title: Options
|
||||
order: 1
|
||||
---
|
||||
|
||||
<embed src="@/docs/api/raster_layer/options.zh.md"></embed>
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
---
|
||||
title: Options
|
||||
order: 1
|
||||
---
|
||||
|
||||
<embed src="@/docs/common/style.md"></embed>
|
||||
|
||||
<embed src="@/docs/common/layer/options.md"></embed>
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
---
|
||||
title: RasterLayer 波段计算
|
||||
order: 3
|
||||
---
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
---
|
||||
title: Raster
|
||||
order: 0
|
||||
---
|
||||
|
||||
<embed src="@/docs/api/raster_layer/raster_layer.zh.md"></embed>
|
||||
|
|
@ -2,3 +2,21 @@
|
|||
title: RasterLayer 多波段计算
|
||||
order: 2
|
||||
---
|
||||
|
||||
<embed src="@/docs/common/style.md"></embed>
|
||||
|
||||
## 简介
|
||||
|
||||
多波段数据叠加计算着色。
|
||||
|
||||
## Option
|
||||
|
||||
<embed src="@/docs/common/layer/options.md"></embed>
|
||||
|
||||
## source
|
||||
|
||||
<embed src="@/docs/api/source/raster/raster_band_calc.md"></embed>
|
||||
|
||||
## style
|
||||
|
||||
<embed src="@/docs/api/raster_layer/common/style.md"></embed>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,6 @@
|
|||
---
|
||||
title: RasterLayer Multi band
|
||||
order: 0
|
||||
---
|
||||
|
||||
<embed src="@/docs/api/raster_layer/raster_multi_band.zh.md"></embed>
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
---
|
||||
title: RasterLayer Multi band
|
||||
order: 0
|
||||
---
|
||||
|
||||
<embed src="@/docs/api/raster_layer/raster_rgb.zh.md"></embed>
|
||||
|
|
@ -19,5 +19,10 @@ order: 1
|
|||
|
||||
## style
|
||||
|
||||
- opacity
|
||||
透明度
|
||||
### opacity 透明度
|
||||
|
||||
```js
|
||||
layer.style({
|
||||
opacity: 0.5,
|
||||
});
|
||||
```
|
||||
|
|
|
|||
|
|
@ -3,4 +3,4 @@ title: RasterLayer single band
|
|||
order: 0
|
||||
---
|
||||
|
||||
<embed src="@/docs/api/raster_layer/raster_layer.zh.md"></embed>
|
||||
<embed src="@/docs/api/raster_layer/raster_single_band.zh.md"></embed>
|
||||
|
|
|
|||
|
|
@ -7,6 +7,12 @@ order: 0
|
|||
|
||||
## 简介
|
||||
|
||||
单波段栅格数据渲染、根据栅格数据进行可视化着色
|
||||
|
||||
## Option
|
||||
|
||||
<embed src="@/docs/common/layer/options.md"></embed>
|
||||
|
||||
`RasterLayer` 图层主要实现栅格数据的可视化，栅格数据主要来源是卫星遥感数据，如数字高程图，植被分布图，夜光图。
|
||||
|
||||
## source
|
||||
|
|
@ -15,4 +21,4 @@ order: 0
|
|||
|
||||
## style
|
||||
|
||||
<embed src="@/docs/api/raster_layer/common/style_single.md"></embed>
|
||||
<embed src="@/docs/api/raster_layer/common/style.md"></embed>
|
||||
|
|
|
|||
|
|
@ -1,6 +0,0 @@
|
|||
---
|
||||
title: Source
|
||||
order: 2
|
||||
---
|
||||
|
||||
<embed src="@/docs/api/raster_layer/source.zh.md"></embed>
|
||||
|
|
@ -1,257 +0,0 @@
|
|||
---
|
||||
title: Source
|
||||
order: 2
|
||||
---
|
||||
|
||||
<embed src="@/docs/common/style.md"></embed>
|
||||
|
||||
栅格图层接受的并不是矢量的地理数据（GeoJSON），而是栅格数据。同时支持传入多种数据格式，入 `tiff`、`lerc` 等。
|
||||
|
||||
```js
|
||||
const source = new Source(data, {
|
||||
parser: {...},
|
||||
});
|
||||
```
|
||||
|
||||
### 加载未解析的栅格数据
|
||||
|
||||
我们可以直接将请求到的栅格文件的二进制数据直接传递给栅格图层使用，此时我们不仅仅可以选择加载多波段的数据，同时还可以对栅格数据进行简单的数学计算。
|
||||
|
||||
- 对多（单）波段的数据进行数学运算。
|
||||
- 绘制彩色遥感影像（真、假彩色）。
|
||||
- 需要提供解析栅格数据的标准方法。
|
||||
|
||||
```js
|
||||
// 对单波段数据进行运算
|
||||
async function getTiffData() {
|
||||
const response = await fetch(
|
||||
'https://gw.alipayobjects.com/os/rmsportal/XKgkjjGaAzRyKupCBiYW.dat',
|
||||
);
|
||||
const arrayBuffer = await response.arrayBuffer();
|
||||
return arrayBuffer;
|
||||
}
|
||||
const tiffdata = await getTiffData();
|
||||
const layer = new RasterLayer({});
|
||||
layer.source(
|
||||
[
|
||||
{
|
||||
data: tiffdata,
|
||||
bands: [0],
|
||||
},
|
||||
],
|
||||
{
|
||||
parser: {
|
||||
type: 'raster',
|
||||
format: async (data, bands) => {
|
||||
const tiff = await GeoTIFF.fromArrayBuffer(data);
|
||||
const imageCount = await tiff.getImageCount();
|
||||
const image = await tiff.getImage(bands[0]);
|
||||
const width = image.getWidth();
|
||||
const height = image.getHeight();
|
||||
const values = await image.readRasters();
|
||||
return { rasterData: values[0], width, height };
|
||||
},
|
||||
operation: ['*', ['band', 0], 0.5],
|
||||
extent: [73.482190241, 3.82501784112, 135.106618732, 57.6300459963],
|
||||
},
|
||||
},
|
||||
);
|
||||
```
|
||||
|
||||
#### data: IBandsData[] | IBandsData
|
||||
|
||||
用户可以直接传入栅格文件的二进制数据。
|
||||
|
||||
- 支持传入多文件的数据。
|
||||
- 支持指定某个栅格文件要提取的波段。
|
||||
|
||||
```js
|
||||
interface IBandsData {
|
||||
data: ArrayBuffer; // 请求加载的栅格文件的二进制数据
|
||||
bands?: number[]; // 指定加载该栅格文件的波段
|
||||
}
|
||||
// 默认加载 0 波段的数据
|
||||
const source = new Source({ data: tiffData });
|
||||
// 指定加载 tiffData 0 波段的数据
|
||||
// 指定加载 tiffData2 0、1 波段的数据
|
||||
const source2 = new Source([
|
||||
{ data: tiffData, bands: [0] },
|
||||
{ data: tiffData2, bands: [0, 1] },
|
||||
]);
|
||||
```
|
||||
|
||||
#### parser
|
||||
|
||||
<description> _IParser_ **必选** </description>
|
||||
|
||||
为使用栅格数据的使用提供必要的参数和方法。
|
||||
|
||||
```js
|
||||
interface IParser {
|
||||
type: string;
|
||||
format: IRasterFormat;
|
||||
operation: IOperation;
|
||||
extent: number[];
|
||||
}
|
||||
```
|
||||
|
||||
##### type
|
||||
|
||||
<description> _string_ **必选** </description>
|
||||
|
||||
- 输出结果为单通道数据的时候值为 raster
|
||||
- 输出结果为多通道彩色的时候值为 rasterRgb
|
||||
|
||||
##### format: IRasterFormat
|
||||
|
||||
<description> _IFormat_ **必选** </description>
|
||||
|
||||
`format` 方法用于从传入的栅格文件二进制数据中提取波段数据。
|
||||
|
||||
- 第一个参数是栅格文件二进制数据。
|
||||
- 第二个参数是第一个参数指定的栅格文件中应该提取的波段，方法参数是我们通过 `source` 参数传递的 `data` 数值。
|
||||
- `format` 是一个 `async` 方法。
|
||||
|
||||
```js
|
||||
interface IRasterData {
|
||||
rasterData: HTMLImageElement | Uint8Array | ImageBitmap | null | undefined;
|
||||
width: number;
|
||||
height: number;
|
||||
}
|
||||
type IRasterFormat = (
|
||||
data: ArrayBuffer,
|
||||
bands: number[],
|
||||
) => Promise<IRasterData | IRasterData[]>;
|
||||
|
||||
const source = new Source(data, {
|
||||
parser: {
|
||||
format: async (data, bands) => {
|
||||
...
|
||||
return {
|
||||
rasterData: bandData,
|
||||
width: 256;
|
||||
height: 256;
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
1. `format` 方法的返回值为栅格数据（`rasterData`）以及表示大小的 `width`、`height` 参数。
|
||||
2. `format` 方法可以返回多份数据，表示从当前栅格文件中提取多份波段的数据。
|
||||
|
||||
##### operation: IOperation
|
||||
|
||||
<description> _IOperation_ **可选** </description>
|
||||
|
||||
在加载多波段数据的时候我们可以通过 `operation` 配置波段数据的运算。
|
||||
|
||||
🌟 我们可以不配置 `operation`，此时默认使用第一个栅格文件提取的第一个波段数据
|
||||
|
||||
1. `operation` 可以是一个函数，`allbands` 是我们从所有栅格文件中提取的所有波段数据的集合。
|
||||
|
||||
```js
|
||||
const parser = {
|
||||
operation: (allBands) => {
|
||||
// operation 可以是一个函数，allbands 是我们从所有栅格文件中提取的所有波段数据的集合，
|
||||
// 在设立 allbands 就是 [band0]
|
||||
// 函数的返回值是单纯的波段数据，在这里我们直接返回第一个波段的数据
|
||||
return allBands[0].rasterData;
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
2. `operation` 可以是以数组形式存在的计算表达式.
|
||||
|
||||
```js
|
||||
// 下面表达式可以转述为 band1 * 0.5，表示将波段1 的值都乘上 0.5 并返回
|
||||
const parser = {
|
||||
operation: ['*', ['band', 1], 0.5],
|
||||
};
|
||||
```
|
||||
|
||||
3. `operation` 可以嵌套使用：`['+', ['*', ['band', 0], 0.2], ['band', 1]]]`，返回结果为：`band0 * 0.2 + band1`。
|
||||
|
||||
4. `operation` 可以直接指定结果：`['band', 0]`。
|
||||
|
||||
5. `operation` 支持以下的数学运算。
|
||||
|
||||
```js
|
||||
/** 数学运算 根据计算表达式进行数学运算
|
||||
* * * Math operators:
|
||||
* `['*', value1, value2]` 返回 `value1 * value2`
|
||||
* `['/', value1, value2]` 返回 `value1 / value2`
|
||||
* `['+', value1, value2]` 返回 `value1 + value2`
|
||||
* `['-', value1, value2]` 返回 `value2 - value1`
|
||||
* `['%', value1, value2]` 返回 `value1 % value2`
|
||||
* `['^', value1, value2]` 返回 `value1 ^ value2`
|
||||
* `['abs', value1]` 返回 `Math.abs(value1)`
|
||||
* `['floor', value1]` 返回 `Math.floor(value1)`
|
||||
* `['round', value1]` 返回 `Math.round(value1)`
|
||||
* `['ceil', value1]` 返回 `Math.ceil(value1)`
|
||||
* `['sin', value1]` 返回 `Math.sin(value1)`
|
||||
* `['cos', value1]` 返回 `Math.cos(value1)`
|
||||
* `['atan', value1, value2]` 返回 `n1===-1?Math.atan(n1): Math.atan2(n1, n2)`
|
||||
*/
|
||||
```
|
||||
|
||||
##### extent
|
||||
|
||||
<description> _number[]_ **必选** </description>
|
||||
|
||||
`extent` 描述的是栅格数据覆盖的地理区间，数值指定的是区域的经纬度区间（左下角和右上角）。
|
||||
|
||||
### 加载多通道（彩色）影像
|
||||
|
||||
我们在使用多波段数据的时候支持根据多波段数据绘制彩色遥感影像，如下图的假彩色影像。
|
||||
|
||||
<div>
|
||||
<div style="width:60%;float:left; margin: 10px;">
|
||||
<img width="80%" alt="案例" src='https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*jO7kTpuDiOQAAAAAAAAAAAAAARQnAQ'>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
#### data: IBandsData[] | IBandsData
|
||||
|
||||
绘制多通道影像的时候，需要加载多波段数据
|
||||
|
||||
#### parser
|
||||
|
||||
使用栅格数据的使用提供必要的参数和方法， 具体使用和多波段栅格的 `parser` 保持一致。
|
||||
|
||||
##### type
|
||||
|
||||
<description> _string_ **必选** </description>
|
||||
|
||||
- 输出结果为多通道彩色的时候值为 `rasterRgb`。
|
||||
|
||||
##### format: IRasterFormat
|
||||
|
||||
<description> _IFormat_ **必选** </description>
|
||||
|
||||
绘制多通道影像的时候，使用通用的 `format`函数。
|
||||
|
||||
##### operation: IOperation
|
||||
|
||||
<description> _IOperation_ **必选** </description>
|
||||
|
||||
为了绘制多通道影像，我们必须要提供 `operation` 配置指定多通道数据。
|
||||
|
||||
1. 在渲染彩色多通道栅格的时候需要额外使用 parser，同时彩色栅格图层不再支持 domain、rampColor 等参数，渲染的结果直接由波段计算出的 r、g、b 通道的数值结果控制。
|
||||
|
||||
2. 彩色栅格不再兼容旧的数据传值方式（直接传入解析完的栅格数据。
|
||||
|
||||
```js
|
||||
const source = new Source(data, { // 彩色栅格和单通道栅格使用相同的规则
|
||||
parser: {
|
||||
type: 'rasterRgb', // 使用独立的 type 类型
|
||||
format: async (data, bands) {...}, // 彩色栅格和单通道栅格 format 使用相同
|
||||
// operation 为对象，分别为 rgb 三通道指定计算表达式
|
||||
// operation 必须要配置
|
||||
operation: {
|
||||
r: ['*', ['band', 1], 0.5],
|
||||
g: ['band', 1],
|
||||
b: undefined // 缺省配置表达式的通道会默认取 0 号波段的值
|
||||
}
|
||||
}
|
||||
```
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
---
|
||||
title: Style
|
||||
order: 4
|
||||
---
|
||||
|
||||
<embed src="@/docs/api/raster_layer/style.zh.md"></embed>
|
||||
|
|
@ -0,0 +1,74 @@
|
|||
### data
|
||||
|
||||
|
||||
### parser
|
||||
|
||||
#### format
|
||||
|
||||
`format` 方法用于从传入的栅格文件二进制数据中提取波段数据。
|
||||
|
||||
- 第一个参数是栅格文件二进制数据
|
||||
|
||||
- 第二个参数是第一个参数指定的栅格文件中应该提取的波段
|
||||
|
||||
- `format` 是一个 `async` 方法。
|
||||
|
||||
#### operation 快捷计算
|
||||
归一化指数
|
||||
|
||||
```ts
|
||||
{
|
||||
type:'nd'
|
||||
}
|
||||
```
|
||||
|
||||
#### operation 表达式
|
||||
|
||||
- 示例一
|
||||
|
||||
```ts
|
||||
// band1 * 0.5
|
||||
{
|
||||
operation: ['*', ['band', 1], 0.5],
|
||||
};
|
||||
```
|
||||
|
||||
- 示例二 嵌套使用
|
||||
|
||||
```ts
|
||||
// band0 * 0.2 + band1
|
||||
{
|
||||
operation:['+', ['*', ['band', 0], 0.2], ['band', 1]]]
|
||||
};
|
||||
```
|
||||
|
||||
- 示例三 归一化指数
|
||||
|
||||
```ts
|
||||
// 植被指数计算
|
||||
{
|
||||
operation:['/',
|
||||
['-', ['band', 1], ['band', 0]], // R > NIR
|
||||
['+', ['band', 1], ['band', 0]]
|
||||
]
|
||||
};
|
||||
```
|
||||
|
||||
- operation 表达式类型
|
||||
|
||||
- *`['*', value1, value2]` 返回 `value1 * value2`
|
||||
- / `['/', value1, value2]` 返回 `value1 / value2`
|
||||
- +`['+', value1, value2]` 返回 `value1 + value2`
|
||||
- -`['-', value1, value2]` 返回 `value2 - value1`
|
||||
- % `['%', value1, value2]` 返回 `value1 % value2`
|
||||
- ^ `['^', value1, value2]` 返回 `value1 ^ value2`
|
||||
- abs`['abs', value1]` 返回 `Math.abs(value1)`
|
||||
- floor `['floor', value1]` 返回 `Math.floor(value1)`
|
||||
- round `['round', value1]` 返回 `Math.round(value1)`
|
||||
- ceil `['ceil', value1]` 返回 `Math.ceil(value1)`
|
||||
- sin `['sin', value1]` 返回 `Math.sin(value1)`
|
||||
- cos `['cos', value1]` 返回 `Math.cos(value1)`
|
||||
- atan `['atan', value1, value2]` 返回 `n1===-1?Math.atan(n1):
|
||||
|
||||
|
||||
|
||||
|
|
@ -60,17 +60,37 @@ layer.source(
|
|||
},
|
||||
)
|
||||
|
||||
```
|
||||
#### 多文件多波段
|
||||
|
||||
```ts
|
||||
|
||||
const urls = [
|
||||
{
|
||||
url: 'https://ganos.oss-cn-hangzhou.aliyuncs.com/m2/l7/tiff_jx/{z}/{x}/{y}.tiff',
|
||||
bands: [0]
|
||||
},
|
||||
{
|
||||
url: 'https://ganos.oss-cn-hangzhou.aliyuncs.com/m2/l7/tiff_jx/{z}/{x}/{y}.tiff'
|
||||
},
|
||||
...
|
||||
]
|
||||
const tileSource = new Source(urls, {...});
|
||||
```
|
||||
|
||||
### parser
|
||||
|
||||
- type: `rasterRgb`
|
||||
#### type: `rasterRgb`
|
||||
多波段数据影像合成
|
||||
- extent: 栅格的经纬度范围 [minlng, minlat,maxLng, maxLat]
|
||||
#### extent: 栅格的经纬度范围 [minlng, minlat,maxLng, maxLat]
|
||||
|
||||
#### operation 合成方式
|
||||
rgb 会自动根据最大值最小值进行拉伸处理
|
||||
|
||||
- operation 合成方式
|
||||
- type `rgb`
|
||||
- format 数据处理方法，栅格数据解析方式
|
||||
|
||||
#### format 数据处理方法，栅格数据解析方式
|
||||
|
||||
- 入参数：
|
||||
- data: source 传入参数
|
||||
- bands 波段序号
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
## data
|
||||
### data
|
||||
|
||||
data 解析后的数据，为数组
|
||||
|
||||
|
|
@ -39,7 +39,7 @@ layer.source(tiffdata.data, {
|
|||
});
|
||||
```
|
||||
|
||||
## parser
|
||||
### parser
|
||||
|
||||
- type: raster
|
||||
- extent: 栅格的经纬度范围 [minlng, minlat,maxLng, maxLat]
|
||||
|
|
|
|||
|
|
@ -0,0 +1,6 @@
|
|||
---
|
||||
title: Raster RGB
|
||||
order: 5
|
||||
---
|
||||
|
||||
<embed src="@/docs/api/source/raster/raster_rgb.md"></embed>
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
---
|
||||
title: Raster RGB
|
||||
order: 5
|
||||
---
|
||||
|
||||
<embed src="@/docs/api/source/raster/raster_rgb.md"></embed>
|
||||
|
|
@ -32,5 +32,3 @@ const layer = new PointLayer({
|
|||
featureId: 'id',
|
||||
});
|
||||
```
|
||||
|
||||
<embed src="@/docs/common/layer/options.md"></embed>
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@ const source = new Source(data, {
|
|||
`geojsonOptions` 支持如下参数:
|
||||
|
||||
| 参数 | 类型 | 默认值 | 描述 |
|
||||
| -------------- | ----------- | -------- | -------------------------------------------------------------- | ------------------------------------------------------- |
|
||||
| -------------- | ----------- | -------- |-------------------------- |
|
||||
| maxZoom | `number` | `14` | max zoom to preserve detail on |
|
||||
| indexMaxZoom | `number` | `5` | max zoom in the tile index |
|
||||
| indexMaxPoints | `number` | `100000` | max number of points per tile in the tile index |
|
||||
|
|
|
|||
|
|
@ -1,36 +0,0 @@
|
|||
---
|
||||
title: Options
|
||||
order: 1
|
||||
---
|
||||
|
||||
<embed src="@/docs/common/style.md"></embed>
|
||||
|
||||
### sourceLayer
|
||||
|
||||
<description> _string_ **required** </description>
|
||||
|
||||
只有矢量图层生效，用于设置矢量图层的数据源。
|
||||
|
||||
🌟 一般矢量服务返回的数据中存在多个图层的数据，我们需要从中进行选取。
|
||||
|
||||
```javascript
|
||||
const layer = new PointLayer({
|
||||
sourceLayer: 'city',
|
||||
});
|
||||
```
|
||||
|
||||
### featureId
|
||||
|
||||
<description> _string_ **optional** _default:_ 自动数字编号</description>
|
||||
|
||||
只有矢量图层生效，用于指定矢量图层的编码 `id`。
|
||||
|
||||
🌟 编码 `id` 用于在图层高亮时使用。
|
||||
|
||||
```javascript
|
||||
const layer = new PointLayer({
|
||||
featureId: 'id',
|
||||
});
|
||||
```
|
||||
|
||||
<embed src="@/docs/common/layer/options.md"></embed>
|
||||
|
|
@ -205,64 +205,6 @@ const source = new Source(data, {
|
|||
})
|
||||
```
|
||||
|
||||
1. `format` 方法的返回值为栅格数据（`rasterData`）以及表示大小的 `width`、`height` 参数。
|
||||
2. `format` 方法可以返回多份数据，表示从当前栅格文件中提取多份波段的数据。
|
||||
|
||||
##### operation: IOperation
|
||||
|
||||
<description> _IOperation_ **可选** </description>
|
||||
|
||||
在加载多波段数据的时候我们可以通过 `operation` 配置波段数据的运算。
|
||||
|
||||
🌟 我们可以不配置 `operation`，此时默认使用第一个栅格文件提取的第一个波段数据
|
||||
|
||||
1. `operation` 可以是一个函数，`allbands` 是我们从所有栅格文件中提取的所有波段数据的集合。
|
||||
|
||||
```js
|
||||
const parser = {
|
||||
operation: (allBands) => {
|
||||
// operation 可以是一个函数，allbands 是我们从所有栅格文件中提取的所有波段数据的集合，
|
||||
// 在设立 allbands 就是 [band0]
|
||||
// 函数的返回值是单纯的波段数据，在这里我们直接返回第一个波段的数据
|
||||
return allBands[0].rasterData;
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
2. `operation` 可以是以数组形式存在的计算表达式.
|
||||
|
||||
```js
|
||||
// 下面表达式可以转述为 band1 * 0.5，表示将波段1 的值都乘上 0.5 并返回
|
||||
const parser = {
|
||||
operation: ['*', ['band', 1], 0.5],
|
||||
};
|
||||
```
|
||||
|
||||
3. `operation` 可以嵌套使用：`['+', ['*', ['band', 0], 0.2], ['band', 1]]]`，返回结果为：`band0 * 0.2 + band1`。
|
||||
|
||||
4. `operation` 可以直接指定结果：`['band', 0]`。
|
||||
|
||||
5. `operation` 支持以下的数学运算。
|
||||
|
||||
```js
|
||||
/** 数学运算 根据计算表达式进行数学运算
|
||||
* * * Math operators:
|
||||
* `['*', value1, value2]` 返回 `value1 * value2`
|
||||
* `['/', value1, value2]` 返回 `value1 / value2`
|
||||
* `['+', value1, value2]` 返回 `value1 + value2`
|
||||
* `['-', value1, value2]` 返回 `value2 - value1`
|
||||
* `['%', value1, value2]` 返回 `value1 % value2`
|
||||
* `['^', value1, value2]` 返回 `value1 ^ value2`
|
||||
* `['abs', value1]` 返回 `Math.abs(value1)`
|
||||
* `['floor', value1]` 返回 `Math.floor(value1)`
|
||||
* `['round', value1]` 返回 `Math.round(value1)`
|
||||
* `['ceil', value1]` 返回 `Math.ceil(value1)`
|
||||
* `['sin', value1]` 返回 `Math.sin(value1)`
|
||||
* `['cos', value1]` 返回 `Math.cos(value1)`
|
||||
* `['atan', value1, value2]` 返回 `n1===-1?Math.atan(n1): Math.atan2(n1, n2)`
|
||||
*/
|
||||
```
|
||||
|
||||
## style
|
||||
|
||||
<embed src="@/docs/api/raster_layer/common/style_single.md"></embed>
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
---
|
||||
title: Style
|
||||
order: 4
|
||||
---
|
||||
|
||||
<embed src="@/docs/api/tile/style.zh.md"></embed>
|
||||
|
|
@ -5,6 +5,8 @@ order: 0
|
|||
|
||||
<embed src="@/docs/common/style.md"></embed>
|
||||
|
||||
### 简介
|
||||
|
||||
`L7` 的矢量瓦片图层复用了普通图层的数据可视化能力，支持对图层的样式进行数据映射。目前矢量瓦片支持了点、线、面、掩模等图层
|
||||
|
||||
| 分类 | Layer | parserType | 描述 |
|
||||
|
|
@ -15,7 +17,10 @@ order: 0
|
|||
| 矢量瓦片 | `MaskLayer` | parser of MaskLayer、`geojsonvt` | 矢量掩模图层 |
|
||||
| 矢量瓦片 | `TileDebugLayer` | `/` | `TileDebugLayer` 不需要执行 `source` 方法 |
|
||||
|
||||
### option
|
||||
瓦片图层其他配置项和基础图层 PointLayer、Linelayer、PolygonLayer 保持一致
|
||||
|
||||
### options
|
||||
|
||||
<embed src="@/docs/api/tile/common/options.zh.md"></embed>
|
||||
|
||||
### source(url: string, option: IOption)
|
||||
|
|
@ -63,7 +68,7 @@ const source = new Source(url, {
|
|||
type UpdateTileStrategy = 'realtime' | 'overlap' | 'replace';
|
||||
```
|
||||
|
||||
🌟 矢量瓦片推荐复用瓦片服务。
|
||||
🌟 矢量瓦片推荐复用 Source
|
||||
|
||||
```js
|
||||
const vectorSource = new Source(
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"private": true,
|
||||
"name": "@antv/l7-site",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "L7 sites deployed on gh-pages",
|
||||
"keywords": [
|
||||
"antv",
|
||||
|
|
@ -34,12 +34,12 @@
|
|||
"site:publish": "gh-pages -d public"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@antv/dumi-theme-antv": "^0.3.0-beta.24",
|
||||
"@antv/dumi-theme-antv": "^0.3.0",
|
||||
"@antv/g2": "^4.2.8",
|
||||
"@antv/l7": "2.11.0",
|
||||
"@antv/l7": "2.11.1",
|
||||
"@antv/l7-draw": "^3.0.9",
|
||||
"@antv/l7-maps": "2.11.0",
|
||||
"@antv/l7-three": "2.11.0",
|
||||
"@antv/l7-maps": "2.11.1",
|
||||
"@antv/l7-three": "2.11.1",
|
||||
"@antv/l7plot": "^0.3.3",
|
||||
"@antv/util": "^2.0.9",
|
||||
"@turf/turf": "^6.5.0",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-source",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
@ -25,8 +25,8 @@
|
|||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/async-hook": "^2.2.9",
|
||||
"@antv/l7-core": "2.11.0",
|
||||
"@antv/l7-utils": "2.11.0",
|
||||
"@antv/l7-core": "2.11.1",
|
||||
"@antv/l7-utils": "2.11.1",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@mapbox/geojson-rewind": "^0.5.2",
|
||||
"@mapbox/vector-tile": "^1.3.1",
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"private": true,
|
||||
"name": "@antv/l7-test-utils",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "Now I’m the model of a modern major general / The venerated Virginian veteran whose men are all / Lining up, to put me up on a pedestal / Writin’ letters to relatives / Embellishin’ my elegance and eloquence / But the elephant is in the room / The truth is in ya face when ya hear the British cannons go / BOOM",
|
||||
"keywords": [],
|
||||
"author": "lzxue <lzx199065@gmail.com>",
|
||||
|
|
@ -39,9 +39,9 @@
|
|||
"url": "https://github.com/antvis/L7/issues"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@antv/l7-map": "2.11.0",
|
||||
"@antv/l7-maps": "2.11.0",
|
||||
"@antv/l7-scene": "2.11.0",
|
||||
"@antv/l7-map": "2.11.1",
|
||||
"@antv/l7-maps": "2.11.1",
|
||||
"@antv/l7-scene": "2.11.1",
|
||||
"gl": "^5.0.3",
|
||||
"l7regl": "^0.0.20"
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-three",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "three for L7 ",
|
||||
"keywords": [
|
||||
"3D",
|
||||
|
|
@ -44,7 +44,7 @@
|
|||
},
|
||||
"homepage": "https://github.com/antvis/L7#readme",
|
||||
"dependencies": {
|
||||
"@antv/l7": "2.11.0",
|
||||
"@antv/l7": "2.11.1",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"inversify": "^5.0.1",
|
||||
"reflect-metadata": "^0.1.13",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-utils",
|
||||
"version": "2.11.0",
|
||||
"version": "2.11.1",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ git checkout -b $feat_name
|
|||
|
||||
cd ../../
|
||||
echo `pwd`
|
||||
rsync -av --exclude .dumi/tmp-production --exclude .dumi/tmp --exclude node_modules --exclude public --exclude dist ./packages/site/ ./site_temp/l7-site/
|
||||
rsync -av --exclude .cache --exclude .dumi/tmp-production --exclude .dumi/tmp --exclude node_modules --exclude public --exclude dist ./packages/site/ ./site_temp/l7-site/
|
||||
|
||||
cd ./site_temp/l7-site
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue