Components are the modular building blocks of charts in Plottable. A Component is an object that requires visual space and can be placed on a table. Examples of Components include Axes, Labels, Legends, Gridlines, and Plots.
Components can be overlaid on top of each other by placing them in a single Group, which is a Component in itself.
A library of available components is available here.
Scales can be thought of as functions (in the mathematical sense) that map values from a domain to a range. They
essentially function as bridges between Components. For example, if both a Plot and an Axis are driven by the
same Scale, then changes to the Plot, such as zooming in and out to change the domain of the data, will be
reflected in the Axis.
At the core of any Plottable-based chart is a table-based layout engine. Think of Plottable as a table within an svg
element, where each cell in the Table can draw a Component. Take the following example:
As you can see, there is one Table with two columns and two rows. We represent this Table as an array of arrays of Components:
// Table as an array of arrays
[
[yAxis, linePlot],
[null, xAxis ]
]
Tables themselves are also Components. As a result, we can create much more complicated charts by nesting Tables within a larger Table.
Now that you have the conceptual background for how charts in Plottable are built, hop on over to the next tutorial, building a basic chart