Chartjs-ChartJS – Why is the transition on the first dataset bad?

1👍

For anyone who has the same issue in the future, here is the solution:

The problem with my code was that the first state of the instaDataClick variable was an empty array, it should have a date property, because the x axis is the date.

so the variable should look something like this:

const initialStartDate = new Date(moment().subtract(10, 'd').format('YYYY-MM-DD'))
const initialEndDate = new Date(moment().format('YYYY-MM-DD'))

 const [instaDataClick, setInstaDataClick] = useState(
getDaysArray(initialStartDate.toString(), initialEndDate.toString()).map((e)=>{
  return {clicks: null, date: e}
})
)

the function getDaysArray:

const getDaysArray = function (start: any, end: any) {
for (var arr = [], dt = new Date(start); dt <= new Date(end); dt.setDate(dt.getDate() + 1)) {
  arr.push(new Date(dt).toString().substr(4, 6));
}
return arr;
};

And by doing this, we’re setting the initial position of the line.

Leave a comment