HighLow Layer
Variable rendered as highs/lows
Example

import { Deck } from '@deck.gl/core';
import * as WeatherLayers from 'weatherlayers-gl';
// load data
const image = await WeatherLayers.loadTextureData(url);
const deckgl = new Deck({
layers: [
new WeatherLayers.HighLowLayer({
id: 'highLow',
// data properties
image: image,
bounds: [-180, -90, 180, 90],
// style properties
radius: 1000, // km
}),
],
});
Data Properties
See Data properties common for all layers.
Style Properties
See Style properties common for all layers.
radius
radius
Type: number, required
Radius in km to filter nearby values. The greater radius, the less values are detected.
unitFormat
unitFormat
Type: UnitFormat
, optional
Default: null
Unit definition to be used for formatting numbers.
textFormatFunction
textFormatFunction
Type: function (value: number, unitFormat: UnitFormat) => string
, optional
Default: (value, unitFormat) => unitFormat ? formatValue(value, unitFormat) : Math.round(value).toString()
Function to format the value.
textFontFamily
textFontFamily
Type: string, optional
Default: "Helvetica Neue", Arial, Helvetica, sans-serif
Font family of the text. See TextLayer fontFamily.
textSize
textSize
Type: number, optional
Default: 12
Size of the text. See TextLayer getSize.
textColor
textColor
Type: color [number, number, number, number?]
, optional
Default: [255, 255, 255]
Color of the text. See TextLayer getColor.
textOutlineWidth
textOutlineWidth
Type: number, optional
Default: 1
Width of outline around the text, relative to the font size. See TextLayer outlineWidth.
textOutlineColor
textOutlineColor
Type: color [number, number, number, number?]
, optional
Default: [13, 13, 13]
Color of outline around the text. See TextLayer outlineColor.
palette
palette
Type: color palette text or array, optional
Palette used to interpolate values to colors.
Formats:
text (
string
) - see Text format for detailsarray (
[number, PaletteColor][]
) -PaletteColor
is any object accepted by Chroma.js constructor
Last updated