Skip to content

Bar chart

import { BarChart } from '@arshad-shah/swift-chart';
const chart = new BarChart('#chart', { theme: 'midnight' });
chart.setData(monthlySales, { x: 'month', y: ['revenue', 'cost'] });

Colour individual bars by value with a colorFn, or bind to a row field with colorField + colorMap. See the per-datum colours guide for the full resolution chain.

// Either bind via the row data...
chart.setData(regionPnL, {
x: 'region',
y: 'pnl',
colorField: 'sign',
colorMap: { pos: '#22c55e', neg: '#ef4444' },
});
// ...or compute at draw time:
new BarChart('#chart', {
colorFn: (v) => v < 0 ? '#ef4444' : '#22c55e',
}).setData(regionPnL, { x: 'region', y: 'pnl' });