-
Notifications
You must be signed in to change notification settings - Fork 42
Chart
Wiki ▸ API Reference ▸ Chart
The function polyjs.chart()
takes a specification object spec
and renders the graphic. This page explains the attributes that can be set through the spec
object, and other concepts relevant to the specification of charts.
Type | A single Layer Object (for spec.layer) or an array of Layer Objects (for spec.layers) |
Required | Yes |
A layer is where the most important aspect of a chart is defined. Each layer contains information about the type of graphic being plotted, the data being used, as well as which data column are mapped to which visual aesthetics. The attribute spec.layer
should be a JSON object specifying a single layer. You can overlay multiple layers within a single chart (e.g. a scatter plot on top of a bar chart). In that case, the attribute spec.layers
should be used to specify an array of layers. Specification of layers is discussed in the Layer documentation page.
Type | An associate array of aesthetics to Guide Specification Objects. |
Required | No (Optional) |
A guide describes how data and scales are related visually. For instance, the range of the x- and y-axis and the colour palette of a legend all fall under the realm of guides. The guides field expects an associative array which maps aesthetics to JSON objects that specify guides for that aesthetic.
Type | A Coordinate Object |
Required | No (Optional) |
Default | Cartesian coordinate |
This object specifies the type of coordinate system to be used in the graph -- for example, cartesian or polar coordinates.
Type | A Facet Object |
Required | No (Optional) |
Default | No Facet |
Faceting in a chart is a visualization method in which different variables in a dataset may be isolated and displayed separately. This object shall specify what splitting is to be done, and how it will be displayed.
Type | String |
Required | Yes |
A DOM element or an identifier of a DOM element to plot the chart in.
Type | Int |
Required | No (Optional) |
Default | 400 |
The width of the chart in pixels.
Type | Int |
Required | No (Optional) |
Default | 400 |
The height of the chart in pixels.
Type | String |
Required | No (Optional) |
Default | Blank |
The title of the chart.
Type | Bool |
Required | No (Optional) |
Default | True |
Whether or not to add automatic tooltips. (Note, this turns on the polyjs.hander.tooltip
interaction method.)
Type | Bool |
Required | No (Optional) |
Default | True |
Whether or not to add the automatic interaction method that allows users to select to zoom. (Note, this turns on the polyjs.hander.tooltip
interaction method.)
Type | Int |
Required | No (Optional) |
Default | 10 |
An integer defining the amount of white space on the left side of the chart, in pixels.
Type | Int |
Required | No (Optional) |
Default | 10 |
An integer defining the amount of white space on the right side of the chart, in pixels.
Type | Int |
Required | No (Optional) |
Default | 10 |
An integer defining the amount of white space above the chart, in pixels.
Type | Int |
Required | No (Optional) |
Default | 10 |
An integer defining the amount of white space below the chart, in pixels.
Type | Int |
Required | No (Optional) |
Default | 20 |
Vertical spacing between adjacent facets in the same column, in pixels.
Type | Int |
Required | No (Optional) |
Default | 10 |
Horizontal spacing between adjacent facets in the same column, in pixels.
Type | String |
Required | No (Optional) |
Default | 'right' |
The position of the legend with respect to the main body of the chart. Should be one of the following strings: left
, right
, top
, bottom
, none
.