chart

Docs › Interaction and export

Loading, errors and no data

setLoading, setError with retry, and the noData message.

Show a bar-shaped placeholder while data loads (loading: true or chart.setLoading(true)) and report failures with setError(message, retry).

Live example

Code for this example

const chart = createChart('#chart', {
  type: 'bar',
  title: 'Weekly sign-ups',
  loading: true,
  data: { labels: [], series: [] },
});
let tries = 0;
const load = () => {
  chart.setError(null);
  chart.setLoading(true);
  setTimeout(() => {
    chart.setLoading(false);
    if (++tries === 1) return chart.setError('Could not load the stats.', load);
    chart.update({ labels: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'], series: [{ name: 'Sign-ups', data: [42, 51, 38, 64, 57] }] });
  }, 1200);
};
load();
APIWhat it does
loading: true / chart.setLoading(bool)Shows the placeholder and sets aria-busy
chart.setError(message, retry?)An error message with a Try again button; setError(null) clears it
noDataMessage when there is nothing to draw (default 'No data to display')