Skip to content

Plot ​

A Plot is defined using a set of directives that specify attributes, graphical marks, interactors, and legends.

js
plot(
  width(500), // attribute
  rectY(from("table"), { x1: "u", x2: "v", y: "w", fill: "c" }), // mark
  intervalX({ as: selection }), // interactor
  colorLegend() // legend
)

plot ​

plot(...directives)

Create a new Plot instance based on the provided directives and return the corresponding HTML element.

Plot ​

new Plot(element)

Class definition for a Plot. If provided, the input element will be used as the container for the plot, otherwise a new div element will be generated.

element ​

plot.element

The HTML element containing the plot.

margins ​

plot.margins()

Return the specified margins of the plot as an object of the form {left, right, top, bottom}.

innerWidth ​

plot.innerWidth()

Return the "inner" width of the plot, which is the width attribute value minus the leftMargin and rightMargin values.

innerHeight ​

plot.innerHeight()

Return the "inner" height of the plot, which is the height attribute value minus the topMargin and bottomMargin values.

pending ​

plot.pending(mark)

Called by a Mark instance to inform this parent plot that the mark has a pending data update.

update ​

plot.update(mark)

Called by a Mark instance to inform this parent plot that the mark has completed an update.

render ​

plot.render()

Renders this plot within its container element.

getAttribute ​

plot.getAttribute(name)

Returns the attribute value for the given attribute name. Called by attribute directives.

setAttribute ​

plot.setAttribute(name, value, options)

Sets the attribute value for the given attribute name. Returns true if the attribute is updated to a new value, false otherwise. The options hash may include a silent flag to suppress listener updates. Called by attribute directives.

addAttributeListener ​

plot.addAttributeListener(name, callback)

Adds an event listener callback that is invoked when the attribute with the given name is updated.

removeAttributeListener ​

plot.removeAttributeListener(name, callback)

Removes an event listener callback associated with the given attribute name.

addParams ​

plot.addParams(mark, paramSet)

Register a set of Params associated with a mark to coordinate updates. Called by child Mark instances.

addMark ​

plot.addMark(mark)

Add a Mark instance to this plot. Called by mark directives.

markSet ​

plot.markSet

Property getter that returns a Set containing this plot's marks.

addInteractor ​

plot.addInteractor(interactor)

Add an interactor to this plot. Called by interactor directives.

addLegend ​

plot.addLegend(legend, include)

Add a legend associated with this plot. The include flag (default true) indicates if the legend should be included within the same container element as the plot. Called by legend directives.