Class Chart

An instance can subscribe to any of the following events by doing instance.on([eventName], callback), events can be triggered by doing instance.emit([eventName][, params])

  • mouseover fired whenever the mouse is over the canvas
  • mousemove fired whenever the mouse is moved inside the canvas, callback params: a single object {x: number, y: number} (in canvas space coordinates)
  • mouseout fired whenever the mouse is moved outside the canvas
  • before:draw fired before drawing all the graphs
  • after:draw fired after drawing all the graphs
  • zoom fired whenever there's scaling/translation on the graph (x-scale and y-scale of another graph whose scales were updated)
  • tip:update fired whenever the tip position is updated, callback params {x, y, index} (in canvas space coordinates, index is the index of the graph where the tip is on top of)
  • eval fired whenever the sampler evaluates a function, callback params data (an array of segment/points), index (the index of datum in the data array), isHelper (true if the data is created for a helper e.g. for the derivative/secant)

The following events are dispatched to all the linked graphs

  • all:mouseover same as mouseover but it's dispatched in each linked graph
  • all:mousemove same as mousemove but it's dispatched in each linked graph
  • all:mouseout same as mouseout but it's dispatched in each linked graph
  • all:zoom fired whenever there's scaling/translation on the graph, dispatched on all the linked graphs

Hierarchy

  • EventEmitter
    • Chart

Constructors

Properties

canvas: any

g.canvas element that holds the area where the graphs are plotted (clipped with a mask)

content: any

Element that holds the canvas where the functions are drawn

draggable: any

Draggable element that receives zoom and pan events

generation: number

The number of times a function was rendered.

id: string
line: Line<[number, number]>
linkedGraphs: Chart[]

Array of function-plot instances linked to the events of this instance, i.e. when the zoom event is dispatched on this instance it's also dispatched on all the instances of this array

meta: ChartMeta

options are the input options sent to function plot.

root: any

svg element that holds the graph (canvas + title + axes)

tip: any

Element that holds the tip

cache: Record<string, Chart> = {}

Methods

  • buildContent draws each of the datums stored in data.options only. To do a full redraw call instance.plot()

    Returns void

  • destroy destroys the current functionPlot instance. if you added this to other instances through addLink make sure you remove the links from the other instances to this instance using removeLink.

    Returns void

  • The draggable container won't change across different instances of Chart, therefore multiple instances will share the draggable container, to avoid dispatching the event from the old instance grab it in runtime with this function

    Returns Chart

  • Rebuilds the entire graph from scratch recomputing

    • the inner width/height
    • scales/axes

    After this is done it does a complete redraw of all the datums, if only the datums need to be redrawn call instance.renderContent() instead

    Returns

    Chart

    Returns Chart

  • Remove link removes a linked graph.

    Parameters

    Returns void

  • renderContent is a perf optimization to only render the content without rendering the canvas beneath it, when the user interacts with the canvas doing a pan or zoom, it'll call this function instead of #plot (which does a full plot).

    Returns void

  • Validate options provides best effort runtime validation of the options.

    Returns void

Generated using TypeDoc