Line chart
Along with bar graphs and pie charts, line charts are one of the most ubiquitous chart types.
Parameters
- data
JSON/Python dict/various Line charts take their data from a variety of formats, including:
- A list of dictionaries, each of which has an
xand ayelement. - A file containing a JSON representation of such a list.
- A file containing CSV with two numerical columns.
- A Pandas, Fireducks, pyarrow or polars DataFrame, with two columns holding the
xandyvalues.
- A list of dictionaries, each of which has an
- curve
Boolean If true, a cubic spline is plotted to give a smooth(ed) version of the curve connecting the given points.
curveddefaults tofalse.
In addition to all of the standard parameters the following apply to line charts.
Examples
This:
html
<linechart
data='[
{ "x": 1, "y": 10 },
{ "x": 2, "y": 20 },
{ "x": 3, "y": 15 },
{ "x": 4, "y": 25 },
{ "x": 5, "y": 30 },
{ "x": 6, "y": 35 }
]'
width=600
height=600
>
</linechart>produces this:
As shown above, the data provided to the line chart is a list of dictionaries, each of which has a "x" and a "y" entry, with the X and Y values for a point, respectively. The line can also be rendered as a cubic spline (i.e. a curve) by adding the optional curve parameter:
html
<linechart
data='[
{ "x": 1, "y": 10 },
{ "x": 2, "y": 20 },
{ "x": 3, "y": 15 },
{ "x": 4, "y": 25 },
{ "x": 5, "y": 30 },
{ "x": 6, "y": 35 }
]'
width=600
height=600
curved=true
>
</linechart>produces this: