Appearance
From Chart.js
ChartBuddy is not a Chart.js drop-in. Use this as a migration aid.
| Chart.js | ChartBuddy |
|---|---|
type: 'bar' | chartType: 'clusteredBar' (or stacked variants) |
type: 'line' | chartType: 'line' |
data.labels + datasets[].data | seriesData 2D array (+ isDataTransposed: true) |
options.indexAxis: 'y' | orientation: 'horizontal' |
options.plugins.legend | legend: { visible, colors } |
options.plugins.title | title: { visible, text } |
new Chart(ctx, config) | new Insight(el, { chartData }) |
Example mapping
Chart.js:
js
new Chart(ctx, {
type: 'bar',
data: {
labels: ['Q1', 'Q2'],
datasets: [{ label: 'Revenue', data: [100, 112] }],
},
options: { indexAxis: 'y' },
});ChartBuddy:
js
new Insight('#chart', {
persist: false,
chartData: {
chartType: 'clusteredBar',
orientation: 'horizontal',
isDataTransposed: true,
seriesData: [
['', 'Q1', 'Q2'],
['Revenue', 100, 112],
],
title: { visible: true, text: 'Revenue' },
subtitle: { visible: false, text: '' },
legend: { visible: false },
},
});