Class Plot

Canvas-based data plotter.

const p = new Plot(document.getElementById(`myCanvas`), opts);

// Plot 1-5 as series  test'
p.createSeries(`test`, `array`, [1,2,3,4,5]);

// Create a streaming series, add a random number
const s = p.createSeries(`test2`, `stream`);
s.add(Math.random());

createSeries returns the Series instance with properties for fine-tuning

For simple usage, use plot(someData) which automatically creates series for the properties of an object.

Hierarchy (view full)

Constructors

constructor

Properties

_layoutPosition _measuredSize _needsDrawing _needsLayoutX _needsMeasuring _parent _ready axisStrokeColour axisStrokeWidth axisTextColour axisX axisY bounds canvasRegion children debugHue debugLayout defaultSeriesOpts? id legend legendTextColour plotArea scaling series takesSpaceWhenInvisible

Accessors

desiredRegion frozen root seriesLength visible

Methods

addEventHandlers clear clearSeries createSeries createSeriesFromObject debugLog draw drawSelf drawingInvalidated getBounds getChildren hasChild layoutApply layoutInvalidated layoutSelf layoutStart measureApply measurePreflight measureSelf measureStart notify onChildAdded onClick onNotify onPointerLeave onPointerMove plot seriesArray setReady unsetBounds update updateBegin updateComplete fromCanvas

Constructors

constructor

Properties

Protected_layoutPosition

_layoutPosition: undefined | Point

Protected_measuredSize

_measuredSize: undefined | Rect

Protected_needsDrawing

_needsDrawing: boolean = true

Protected_needsLayoutX

_needsLayoutX: boolean = true

Protected_needsMeasuring

_needsMeasuring: boolean = true

Protected Readonly_parent

_parent: undefined | Box

Protected_ready

_ready: boolean = true

axisStrokeColour

axisStrokeColour: string

axisStrokeWidth

axisStrokeWidth: number

axisTextColour

axisTextColour: string

axisX

axisX: AxisX

axisY

axisY: AxisY

bounds

bounds: undefined | RectPositioned

canvasRegion

canvasRegion: RectPositioned = RectsPlaceholderPositioned

Rectangle Box occupies in canvas/etc

Protectedchildren

children: Box[] = []

debugHue

debugHue: number = ...

debugLayout

debugLayout: boolean = false

OptionaldefaultSeriesOpts

defaultSeriesOpts?: SeriesOpts

Readonlyid

id: string

legend

legend: Legend

legendTextColour

legendTextColour: string

plotArea

plotArea: PlotArea

scaling

scaling: ScalingOption

series

series: Map<string, Visual.Plot2.Series>

takesSpaceWhenInvisible

takesSpaceWhenInvisible: boolean = false

Accessors

desiredRegion

  • get desiredRegion(): undefined | BoxRect

  • Gets the box's desired region, or undefined

    Returns undefined | BoxRect

  • set desiredRegion(v): void

  • Sets the box's desired region. Calls onLayoutNeeded()

    Parameters

    Returns void

frozen

  • get frozen(): boolean

  • Returns boolean

  • set frozen(v): void

  • Parameters

    • v: boolean

    Returns void

root

  • get root(): Box

  • Returns the root box

    Returns Box

seriesLength

  • get seriesLength(): number

  • Returns number

visible

  • get visible(): boolean

  • Gets visible state

    Returns boolean

  • set visible(v): void

  • Sets visible state

    Parameters

    • v: boolean

    Returns void

Methods

addEventHandlers

  • addEventHandlers(element): void

  • Called if this is the parent Box

    Parameters

    • element: HTMLElement

    Returns void

clear

  • clear(): void

  • Removes all series, plot, legend and axis data.

    Returns void

clearSeries

  • clearSeries(): void

  • Calls 'clear()' on each of the series

    Returns void

createSeries

createSeriesFromObject

debugLog

  • debugLog(m): void

  • Debug log from this box context

    Parameters

    • m: any

    Returns void

draw

  • draw(ctx, force?): void

  • Parameters

    • ctx: CanvasRenderingContext2D
    • force: boolean = false

    Returns void

ProtecteddrawSelf

  • drawSelf(_ctx): void

  • Draw this object

    Parameters

    • _ctx: CanvasRenderingContext2D

    Returns void

drawingInvalidated

getBounds

getChildren

  • getChildren(): Generator<never, IterableIterator<[number, Box]>, unknown>

  • Returns Generator<never, IterableIterator<[number, Box]>, unknown>

hasChild

  • hasChild(box): boolean

  • Returns true if box is a child

    Parameters

    Returns boolean

ProtectedlayoutApply

layoutInvalidated

  • layoutInvalidated(reason): void

  • Calls notifyChildLayoutNeeded

    Parameters

    • reason: string

    Returns void

ProtectedlayoutSelf

layoutStart

ProtectedmeasureApply

  • measureApply(m): boolean

  • Applies actual size, returning true if size is different than before

    1. Sets _needsLayout to false.
    2. Sets visual to m
    3. Calls measureApply on each child
    4. If there's a change or force, sets needsDrawing to true, and notifies root of measureApplied

    Parameters

    Returns boolean

ProtectedmeasurePreflight

ProtectedmeasureSelf

  • measureSelf(opts, parent?): string | Rect

  • Measure the box

    1. Uses desired rectangle, if possible
    2. Otherwise uses parent's size

    Parameters

    Returns string | Rect

measureStart

  • measureStart(opts, force, parent?): undefined | Measurement

  • Start of measuring

    1. Keeps track of measurements in opts.measurements
    2. If this box takes space 2.1. Measure itself if needed 2.2. Use size
    3. Calls measureStart on each child

    Parameters

    Returns undefined | Measurement

    Measurement

notify

  • notify(message, source): void

  • Sends a message to all child boxes.

    This first calls onNotify on this instance, before calling notify() on each child.

    Parameters

    • message: string
    • source: Box

    Returns void

ProtectedonChildAdded

  • onChildAdded(child): void

  • Notification a child box has been added

    Throws if

    • child has parent as its own child
    • child is same as this
    • child is already child of this

    Parameters

    Returns void

ProtectedonClick

ProtectedonNotify

  • onNotify(_message, _source): void

  • Handles a received message

    Parameters

    • _message: string
    • _source: Box

    Returns void

ProtectedonPointerLeave

ProtectedonPointerMove

  • onPointerMove(_p): void

  • Handler when pointer moves within our region

    Parameters

    Returns void

plot

  • plot(o): void

  • Plots a simple object, eg { x: 10, y: 20, z: 300 } Series are automatically created for each property of o

    Be sure to call update() to visually refresh.

    Parameters

    • o: any

    Returns void

seriesArray

setReady

  • setReady(ready, includeChildren?): void

  • Sets _ready to ready. If includeChildren is true, setReady is called on each child

    Parameters

    • ready: boolean
    • includeChildren: boolean = false

    Returns void

unsetBounds

update

  • update(ctx?, force?): void

  • Performs recalculations and drawing as necessary If nothing needs to happen, function returns.

    Parameters

    • Optionalctx: CanvasRenderingContext2D
    • force: boolean = false

      Force update

    Returns void

ProtectedupdateBegin

ProtectedupdateComplete

  • updateComplete(_measureChanged, _layoutChanged): void

  • Parameters

    • _measureChanged: boolean
    • _layoutChanged: boolean

    Returns void

StaticfromCanvas

Settings

Member Visibility

On This Page

Constructors
Properties
Accessors
Methods