-
Notifications
You must be signed in to change notification settings - Fork 633
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Update site&新增 raster ndi 计算 (#2222)
* feat: 添加归一化指数 parse * chore: 更新文档
- Loading branch information
Showing
68 changed files
with
606 additions
and
918 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,4 +1,5 @@ | ||
export { MapRender as image } from './image'; | ||
export { MapRender as tiff } from './tiff'; | ||
export { MapRender as dem } from './dem'; | ||
export { MapRender as multiband } from './multiband'; | ||
export { MapRender as multiband } from './multiband'; | ||
export { MapRender as ndvi } from './ndvi'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,71 @@ | ||
// @ts-ignore | ||
import { RasterLayer, Scene } from '@antv/l7'; | ||
// @ts-ignore | ||
import * as allMap from '@antv/l7-maps'; | ||
import * as GeoTIFF from 'geotiff'; | ||
|
||
async function getTiffData(url: string) { | ||
const response = await fetch(url); | ||
const arrayBuffer = await response.arrayBuffer(); | ||
return arrayBuffer; | ||
} | ||
|
||
|
||
export function MapRender(option: { | ||
map: string; | ||
renderer: 'device' | 'regl'; | ||
}) { | ||
const scene = new Scene({ | ||
id: 'map', | ||
renderer: option.renderer, | ||
map: new allMap[option.map || 'Map']({ | ||
center: [130.5, 47], | ||
zoom: 10.5, | ||
}), | ||
}); | ||
scene.on('loaded', () => { | ||
addLayer(); | ||
}); | ||
|
||
async function addLayer() { | ||
const url1 = | ||
'https://gw.alipayobjects.com/zos/raptor/1667832825992/LC08_3857_clip_2.tif'; | ||
const tiffdata = await getTiffData(url1); | ||
const layer = new RasterLayer({ zIndex: 10 }); | ||
const tiff = await GeoTIFF.fromArrayBuffer(tiffdata); | ||
const image1 = await tiff.getImage(); | ||
const value = await image1.readRasters(); | ||
layer | ||
.source( | ||
value, | ||
{ | ||
parser: { | ||
type: 'ndi', | ||
width: value.width, | ||
height: value.height, | ||
bands: [3, 4], // 4 为 Band5是近红外(NIR)波段,3 为Band4是红光波段 | ||
extent: [ | ||
130.39565357746957, 46.905730725742366, 130.73364094187343, | ||
47.10217234153133, | ||
], | ||
|
||
} | ||
}, | ||
) | ||
.style({ | ||
domain: [-0.3, 0.5], | ||
rampColors: { | ||
colors: [ | ||
'#ce4a2e', | ||
'#f0a875', | ||
'#fff8ba', | ||
'#bddd8a', | ||
'#5da73e', | ||
'#235117', | ||
], | ||
positions: [0, 0.2, 0.4, 0.6, 0.8, 1.0], | ||
}, | ||
}); | ||
scene.addLayer(layer); | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
62 changes: 62 additions & 0 deletions
62
packages/site/docs/api/common/source/raster/raster_ndi.en.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,62 @@ | ||
raster-ndi(Normalized Difference Indices) source is to calculate the normalized index of multi-band data, such as calculating NDVI/NDWI and other indices. | ||
|
||
### demo | ||
|
||
```ts | ||
layer | ||
.source( | ||
bandsValues, | ||
{ | ||
parser: { | ||
type: 'ndi', | ||
width: bandsValues.width, | ||
height: bandsValues.height, | ||
bands: [4, 3], // start from zero | ||
extent: [ | ||
130.39565357746957, 46.905730725742366, 130.73364094187343, | ||
47.10217234153133, | ||
], | ||
}, | ||
}, | ||
) | ||
``` | ||
|
||
### data | ||
|
||
```ts | ||
type RasterDataType= Uint8Array | Int8Array | Uint16Array | Int16Array | Uint32Array | Int32Array | Float32Array | Float64Array | ||
``` | ||
data is an array type`RasterDataType[]` | ||
* If it is a multi-band Tiff, you can directly use geotiff,js to read all bands. | ||
* If it is a single file and single band data, it needs to be read separately and merged into one data. | ||
Single file multi-band reading example | ||
```ts | ||
async function getTiffData(url: string) { | ||
const response = await fetch(url); | ||
const arrayBuffer = await response.arrayBuffer(); | ||
const tiff = await GeoTIFF.fromArrayBuffer(arrayBuffer); | ||
const image1 = await tiff.getImage(); | ||
const bandsValues = await image1.readRasters(); | ||
return bandsValues; | ||
} | ||
``` | ||
|
||
### parser | ||
|
||
* type parsing type 'rgb'`必选` | ||
|
||
* bands `[number,number] 指定需要归一化的波段,data 数组长度需要大于等于 2 `Required\` | ||
|
||
Note: The bands serial number starts from zero (5, 4 in landsat 8, the band should be set to 4, 3) | ||
|
||
* width length`必选` | ||
|
||
* height width`必选` | ||
|
||
### Complete example | ||
|
||
[Raster RGB](../../../../examples/raster/data_raster/#543) |
68 changes: 68 additions & 0 deletions
68
packages/site/docs/api/common/source/raster/raster_ndi.zh.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,68 @@ | ||
raster-ndi(Normalized Difference Indices) source 是将多波段数据进行归一化指数计算,比如计算NDVI/NDWI 等指数, | ||
|
||
- data 数据 | ||
- option 配置项 | ||
- parser 数据解析参数 | ||
- type 解析类型 `ndi` | ||
|
||
```ts | ||
layer | ||
.source( | ||
bandsValues, | ||
{ | ||
parser: { | ||
type: 'ndi', | ||
width: bandsValues.width, | ||
height: bandsValues.height, | ||
bands: [4, 3], // 从零开始 | ||
extent: [ | ||
130.39565357746957, 46.905730725742366, 130.73364094187343, | ||
47.10217234153133, | ||
], | ||
}, | ||
}, | ||
) | ||
|
||
``` | ||
### data | ||
|
||
|
||
```ts | ||
type RasterDataType= Uint8Array | Int8Array | Uint16Array | Int16Array | Uint32Array | Int32Array | Float32Array | Float64Array | ||
|
||
``` | ||
|
||
data 为数组类型 `RasterDataType[]` | ||
|
||
- 如果是多波段 Tiff 可以直接使用geotiff,js 读取所有波段, | ||
- 如果是单文件单波段数据,需要单独读取并合并成一个数据。 | ||
|
||
单文件多波段读取示例 | ||
|
||
```ts | ||
async function getTiffData(url: string) { | ||
const response = await fetch(url); | ||
const arrayBuffer = await response.arrayBuffer(); | ||
const tiff = await GeoTIFF.fromArrayBuffer(arrayBuffer); | ||
const image1 = await tiff.getImage(); | ||
const bandsValues = await image1.readRasters(); | ||
return bandsValues; | ||
} | ||
|
||
``` | ||
|
||
|
||
### parser | ||
|
||
- type 解析类型 'rgb' `必选` | ||
- bands `[number,number] 指定需要归一化的波段,data 数组长度需要大于等于 2 `必选` | ||
|
||
注:bands 序号从零开始(landsat 8 里的 5,4, 波段这样要设置为 4,3) | ||
|
||
- width 长度 `必选` | ||
- height 宽度 `必选` | ||
|
||
### 完整示例 | ||
|
||
[Raster ndi](../../../../examples/raster/ndi/#ndbi) | ||
|
Oops, something went wrong.