Class: plot

plotty~ plot

The raster plot class.

new plot(options)

Parameters:
Name Type Description
options Object the options to pass to the plot.
Properties
Name Type Argument Default Description
canvas HTMLCanvasElement <optional>
document.createElement('canvas') the canvas to render to
data TypedArray <optional>
the raster data to render
width Number <optional>
the width of the input raster
height Number <optional>
the height of the input raster
datasets Array.<Object> <optional>
a list of named datasets. each must have 'id', 'data', 'width' and 'height'.
colorScaleImage HTMLCanvasElement | HTMLImageElement <optional>
the color scale image to use
colorScale String <optional>
the name of a named color scale to use
domain Array.<Number> <optional>
[0, 1] the value domain to scale the color
displayRange Array.<Number> <optional>
[0, 1] range of values that will be rendered, values outside of the range will be transparent
applyDisplayRange Boolean <optional>
false set if displayRange should be used
clampLow Boolean <optional>
true whether or now values below the domain shall be clamped
clampHigh Boolean <optional>
clampLow whether or now values above the domain shall be clamped (if not defined defaults to clampLow value)
noDataValue Number <optional>
the no-data value that shall always be hidden
matrix Array <optional>
[1, 0, 0, 0, 1, 0, 0, 0, 1 ] Transformation matrix
useWebGL Boolean <optional>
true plotty can also function with pure javascript but it is much slower then using WebGl rendering

Methods


getData()

Get the raw data from the currently selected dataset.
Returns:
the data of the currently selected dataset.
Type
TypedArray

atPoint(x, y)

Query the raw raster data at the specified coordinates.
Parameters:
Name Type Description
x Number the x coordinate
y Number the y coordinate
Returns:
the value at the specified coordinates
Type
Number

setData(data, width, height)

Set the raw raster data to be rendered. This creates a new unnamed dataset.
Parameters:
Name Type Description
data TypedArray the raw raster data. This can be a typed array of any type, but will be coerced to Float32Array when beeing rendered.
width int the width of the raster image
height int the height of the data

addDataset(id, data, width, height)

Add a new named dataset. The semantics are the same as with @see setData.
Parameters:
Name Type Description
id string the identifier for the dataset.
data TypedArray the raw raster data. This can be a typed array of any type, but will be coerced to Float32Array when beeing rendered.
width int the width of the raster image
height int the height of the data

setCurrentDataset(id)

Set the current dataset to be rendered.
Parameters:
Name Type Description
id string the identifier of the dataset to be rendered.

removeDataset(id)

Remove the dataset.
Parameters:
Name Type Description
id string the identifier of the dataset to be removed.

datasetAvailable(id)

Check if the dataset is available.
Parameters:
Name Type Description
id string the identifier of the dataset to check.
Returns:
whether or not a dataset with that identifier is defined
Type
Boolean

getColorScaleImage()

Retrieve the rendered color scale image.
Returns:
the canvas or image element for the rendered color scale
Type
HTMLCanvasElement | HTMLImageElement

setCanvas( [canvas])

Set the canvas to draw to. When no canvas is supplied, a new canvas element is created.
Parameters:
Name Type Argument Description
canvas HTMLCanvasElement <optional>
the canvas element to render to.

setDomain(domain)

Set the new value domain for the rendering.
Parameters:
Name Type Description
domain Array.<float> the value domain range in the form [low, high]

setDisplayRange(view)

Set the display range that will be rendered, values outside of the range will not be rendered (transparent)
Parameters:
Name Type Description
view Array.<float> range array in the form [min, max]

getCanvas()

Get the canvas that is currently rendered to.
Returns:
the canvas that is currently rendered to.
Type
HTMLCanvasElement

setColorScale(name)

Set the currently selected color scale.
Parameters:
Name Type Description
name string the name of the colorscale. Must be registered.

setClamp(clampLow, clampHigh)

Set the clamping for the lower and the upper border of the values. When clamping is enabled for either side, the values below or above will be clamped to the minimum/maximum color.
Parameters:
Name Type Description
clampLow Boolean whether or not the minimum shall be clamped.
clampHigh Boolean whether or not the maxmimum shall be clamped. defaults to clampMin.

setColorScaleImage(colorScaleImage)

Set the currently selected color scale as an image or canvas.
Parameters:
Name Type Description
colorScaleImage HTMLCanvasElement | HTMLImageElement the new color scale image

setNoDataValue(noDataValue)

Set the no-data-value: a special value that will be rendered transparent.
Parameters:
Name Type Description
noDataValue float the no-data-value. Use null to clear a previously set no-data-value.

render()

Render the map to the specified canvas with the given settings.

renderDataset(id)

Render the specified dataset with the current settings.
Parameters:
Name Type Description
id string the identifier of the dataset to render.

getColor(val)

Get the color for the specified value.
Parameters:
Name Type Description
val flaot the value to query the color for.
Returns:
the 4-tuple: red, green, blue, alpha in the range 0-255.
Type
Array

setExpression(expression)

Sets a mathematical expression to be evaluated on the plot. Expression can contain mathematical operations with integer/float values, dataset identifiers or GLSL supported functions with a single parameter. Supported mathematical operations are: add '+', subtract '-', multiply '*', divide '/', power '**', unary plus '+a', unary minus '-a'. Useful GLSL functions are for example: radians, degrees, sin, asin, cos, acos, tan, atan, log2, log, sqrt, exp2, exp, abs, sign, floor, ceil, fract.
Parameters:
Name Type Description
expression string Mathematical expression. Example: '-2 * sin(3.1415 - dataset1) ** 2'