CODEWITHSUNDEEP
javascripttypescriptchart.js
MauriceNino
MauriceNino

Reputation: 6747

How to skip x Axes labels in ChartJS

The only thing I found for this topic is this , but it does not really help solve the problem.

So I have a chart which is filled with some data like this: ChartJS Example

As you can see the values which are not set in the dataSet, are cut off. This is because of this code which fills everything with undefined:

let dataSet: any = {
   label: user.userName,
   backgroundColor: 'rgba(0, 0, 0, 0)',
   borderColor: this.getRandomColor(),
   data: new Array(this.chart.data.labels.length).fill(undefined)
}

After that I fill the data in with this code:

data.forEach((d)=>{
   let tmpDate: Date = new Date(d.date * 1000)
   let insertIndex: number = this.chart.data.labels.indexOf(this.getDateString(tmpDate))
   dataSet.data.splice(insertIndex, 1, d.data) // d.data is a number
})

this.chart.data.datasets.push(dataSet)
this.chart.update()

I would like it to skip the undefined values and create a smooth line across the chart.

Upvotes: 2

Views: 2302

Answers (1)

Bryan
Bryan

Reputation: 3494

spanGaps option in the docs should be what you're looking for.

Upvotes: 3

Related Questions