Raster Layer

Search…
Raster Layer
Variable rendered as a color overlay
Example
Raster Layer
1
import { Deck } from '@deck.gl/core';
2
import * as WeatherLayers from '@weatherlayers/weatherlayers-gl';
3
​
4
// configure WeatherLayers Cloud client
5
WeatherLayers.setClientConfig({
6
  accessToken: 'xxx',
7
});
8
​
9
const deckgl = new Deck({
10
  layers: [
11
    new WeatherLayers.RasterLayer({
12
      // data properties
13
      dataset: 'gfs/wind_10m_above_ground',
14
      datetime: '2022-01-01T00:00:00Z',
15
      
16
      // style properties
17
      palette: [
18
        [0, [255, 255, 255],
19
        [5, [127, 255, 255],
20
        [10, [127, 255, 127],
21
        [15, [255, 255, 127],
22
        [20, [255, 127, 127],
23
        [25, [127, 0, 0],
24
      ],
25
    }),
26
  ],
27
});
Copied!
Example: Picking
1
import { Deck } from '@deck.gl/core';
2
import * as WeatherLayers from '@weatherlayers/weatherlayers-gl';
3
​
4
// configure WeatherLayers Cloud client
5
WeatherLayers.setClientConfig({
6
  accessToken: 'xxx',
7
});
8
​
9
const deckgl = new Deck({
10
  layers: [
11
    new WeatherLayers.RasterLayer({
12
      // data properties
13
      dataset: 'gfs/wind_10m_above_ground',
14
      datetime: '2022-01-01T00:00:00Z',
15
      
16
      // style properties
17
      palette: [
18
        [0, [255, 255, 255],
19
        [5, [127, 255, 255],
20
        [10, [127, 255, 127],
21
        [15, [255, 255, 127],
22
        [20, [255, 127, 127],
23
        [25, [127, 0, 0],
24
      ],
25
​
26
      picking: true,
27
    }),
28
  ],
29
  onHover: event => console.log(event.raster),
30
});
Copied!
Data Properties
​Data properties are common for all layers in the cloud bundle.
Style Properties
​Style properties are the same as in the standalone bundle.
Picking Info
​Picking info is the same as in the standalone bundle.
Layers
Contour Layer
Last modified 3d ago
Copy link
Contents