Questions tagged [chart.js3]

Chart.js 3.x is an updated and newer version of Chart.js.

Chart.js 3.x introduces a number of breaking changes. Major highlights of this version are listed in the 3.x Migration Guide.

For more information on Chart.js, check out the original tag.

112 questions
1
vote
1 answer

How to share same background color for multiple dataset in a chart?

I am trying to use Chart.js to create a bar chart. I want my chart to look like this example where each dataset has the same color on the chart. However, in my case, the color are showing up wrong. I want each category to share the same color across…
Jay
  • 1,168
  • 13
  • 41
1
vote
3 answers

Multiple Charts on One Page in Vue 3

Desired Outcome Display multiple instances of the same chart type on a single page. Example image contains additional data stripped from the code below. The initial chart canvas object is created with Chart.vue component:
MSchmidt
  • 23
  • 5
1
vote
1 answer

Chart.js the point's limit supported

I have a vetor with 50.850 points to plot in the line graph type. I'm using chart.js to show all this points in the graph, but it does not plot. Does anyone know the point's limit the chart.js can show?
Luciana Oliveira
  • 822
  • 4
  • 14
  • 35
1
vote
1 answer

vertical grid line not taking full hight of the canvas in chart js 3.3.2

As i just migrate from version 2.9.4 to 3.2.2 every thing working fine. the only one issue that i facing is vertical gird line not taking full hight of the canvas here is Stackbliz.
bangash
  • 398
  • 1
  • 4
  • 12
1
vote
1 answer

Change the color of the legend box and the color of the x grid lines in chart.js

Good day to all: Recently I have started working with Vue.js(2.6.12) + Vuetify(2.3.10) and Chart.js(3.0.2). So I'm a newbie (again). I have created a componenent which wraps the Bar chart that Chart.js allows us to create. Here it's a picture of…
1
vote
1 answer

Chart.js V3.20 Filtering Legend labels not working

I have a dynamic line chart that I am building with Chart.js with up to 19 datasets possible. I am dynamically entering the data into the datasets (which works great). The issue I am having is that if I have less than 19 datasets, the legend still…
dclark3774
  • 31
  • 3
1
vote
1 answer

padding not working in my chartjs line-graph

I'm using the newest version of chart.js (3.2.1). Padding works if I'm set it to positive values. But padding 0 (or negative values) doesn't set the line graph exactly at the borders of canvas options: { layout: { padding:0 …
snooq
  • 13
  • 5
1
vote
1 answer

Chart.js manipulate each bar in chart with different labels

does anyone know if this is possible? Basically I want the chart to have labels for example [Jan, Feb, March] and I want to be able to toggle these values on and off. Seems like such a simple thing but is proving problematic.
Billy
  • 13
  • 2
1
vote
1 answer

Chart isn't updating with Response data (Chart.js 3.2.1, ng2-charts 3.0.0-beta.9)

I am using Chart.js of version 3.2.1 and ng2-charts of version 3.0.0-beta.9. I was upgrading a project with this versions. I started with mock data and everything was ok: the charts were showing up as expected. Until I started testing with the real…
Neon
  • 111
  • 11
1
vote
1 answer

Chart.js divide stepSize in equal amount of steps

Using chart.js 3.x how to divide the Y-Axis in an equal number of steps that should not exceed more than the total number of three steps. Example chart, I have set the step size which will divide the Y-Axis into three equal steps but it is…
User7723337
  • 11,857
  • 27
  • 101
  • 182