The new Firefly release comes with Plotly charts. (Highcharts is free for non-profit organizations, but not for the government, hence we’ll be phasing it out from Firefly in the future.)
Plotly.js quick start and examples
Chart attribute reference
Histogram examples
To show Plotly chart with your data
firefly.showPlot('divId', {chartId: 'myPlotlyChart', chartType: 'plot.ly', data: plotlyDataArray, layout: plotlyLayoutObject});
If you deploy Firefly on a local Tomcat server, you can see the examples at http://localhost:8080/firefly/demo/ffapi-highlevel-charttest.html
I don’t think you are using charts connected to a table, but this is how you would do it in Firefly.
It is possible to substitute any array property of a Plotly trace data with the values in a table column.
Examples of the array properties in Plotly data:
- for scatter data:
x, y, z, text, marker.size, marker.color, error_x.array, error_x.arrayminus, error_y.array, error_y.arrayminus - for bar chart:
x, y, width, text, marker.color
For example,
trace1 = {
x: "tables::test-tbl,ra",
y: "tables::test-tbl,dec",
mode: 'markers',
type: 'scatter'
};
defines Plotly trace, connected to the table with ‘test-tbl’ id. Whenever the table changes (for example, when filtered), the chart will change accordingly.