Chartjs-Click on all bar chart labels shows only two days

by

0👍

✅

Provide the Min Max Configuration for the time cartesian axis. This will allow you to show the min and max date in your x-axis even when all the labels are un-selected.

let sortedDates = data.map(x => x.periodStartTime).sort();

let minDate = sortedDates[0];
let maxDate = sortedDates[sortedDates.length - 1];

const mergedKeys = this.getChartKeys(data);

const chartGenericDataSets = this.generateChartData(mergedKeys);

this.chart = new Chart('eventsChart', {
  ...,
  options: {
    scales: {
      x: {
        type: 'time',
        time: {
          unit: 'day',
        },
        min: minDate,
        max: maxDate
      },
    },
    aspectRatio: 2,
    maintainAspectRatio: false,
    responsive: true,
  },
});

Demo @ StackBlitz

Leave a comment