---
url: https://chartbuddy.io/embed/docs/migrations/from-chartjs.md
---
# 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', {
  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 },
  },
});
```