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
0
votes
1 answer

Animating outerRadius and innerRadius

I create some hover and clicked changes that increase and decrease the outerRadius and innerRadius properties on a doughnut chart. But I would like the movement more smooth. const config = { type: 'doughnut', data: data, options: { …
marcelo2605
  • 2,734
  • 4
  • 29
  • 55
0
votes
1 answer

Chart js cut the title and the legends

I wrote a chart.js graphic code setting the title and axis X and Y legends. When I changed the version, the both dissapear in the graphic. Does anyone have the same problem? I'm using chat.js min.js version 3.3.2 actually. The options' code: …
Luciana Oliveira
  • 822
  • 4
  • 14
  • 35
0
votes
1 answer

Chart.js (v3) Doughnut with rounded edges, but not everywhere

I know there are a few answer for this, but it seems this one is a bit different. I need to change doughnut chart, rounded the first one and the last but one too. So in my example the black (first dataset) only would be rounded on the beginning (one…
levipadre
  • 569
  • 7
  • 31
0
votes
1 answer

Is there a way to have the tooltips always shown on a pie/doughnut in Chart.js v3?

I'm trying to have the tooltips always shown on a doughnut in Chart.js v3. Is there any way to achieve this?
Babis
  • 1
0
votes
1 answer

Canvas line chart on this graph stretch beyond the assigned lengths

Why does the line chart on this graph stretch beyond the assigned lengths. In this demo I have a line chart where the height automatically grows to 2355 although I am setting the canvas height to 250. How can I control the height of the line chart?…
cm0001
  • 21
  • 1
  • 4
0
votes
1 answer

Font size will not change Chart.js version 3.2.1

Trying to change the font size of a bar chart in chart.js version 3.2.1. The following does not work and so far the option I've found online pertain to different versions. How do you change the font size for the following bar chart. Thank…
cm0001
  • 21
  • 1
  • 4
0
votes
0 answers

add numeric value with different color in radar labels

I am new to chart.js. i need help in adding a numeric value to radar chart point labels with different color. eg radar label with styling labels color should be in black. numeric value should be in a different predefined color(eg blue). new…
0
votes
1 answer

How to make a 1D scatter plot with Charts.js?

I'm trying to create a 1D scatter plot with Charts.js. This is the best I could do: I like the visual effect of using "line" and rotating it 90 degrees. However, I wish the graph was smaller along the Y axis. I've already set display: false on the…
Simone
  • 1,260
  • 1
  • 16
  • 27
0
votes
1 answer

Chart.js multiple datasets on one y axis

I am using chartjs v3 (latest) and I'm trying to render a graph with multiple datasets that share one y axis. Currently I have the following code: const buff = await defaultChartRenderer({ type: 'line', data:…
ryanarex
  • 1
  • 1
0
votes
1 answer

Radar Chart, Chart.js v3.2 labels customization

how can i customize labels in radar chart? i'm not refer to legend's labels, but the voice at the vertex of the radar chart in particular font and color i search a lot but i found soluton for older version, and only for color property I just tried…
Gabriele
  • 3
  • 2
0
votes
1 answer

How to use below syntax in chart.js 3.x?

How to use below syntax in chart.js version 3? Chart.defaults.LineWithLine = Chart.defaults.line; Chart.controllers.LineWithLine = Chart.controllers.line.extend({ draw: function(ease) { …
suraj
  • 1
  • 2
0
votes
1 answer

No multiple lables for grouped and stacked bar charts in chartjs

I'm trying to create a stacked bar chart with groups in chart.js. But I don't want the labels to be there multiple times, instead just one unique label. Here's the dataset: datasets: [ { label: 'First Label', data: [1,2,3], borderColor:…
0
votes
1 answer

chart.js update() function not working correctly

Ive ran into a problem with chart.js where the animation isnt playing correctly even though the update() function isnt set to 0, the animation only plays "once" and after it finishes it doesnt update anymore. Any help would be greatly…
user15455820
0
votes
1 answer

How can i change tick val to title in ChartJS

Hello tell please how is possible show text title instead int values, look at pic, ChartJS ver.3
MOtoroller
  • 59
  • 4
0
votes
1 answer

Dynamic maximum y-axis value on Chart.js

With Chart.js, is there a way of setting a dynamic maximum y-axis value? I have a chart for which the absolute maximum for a value is always 999. If the values are low (50, 100 or 200 for instance), the y-axis auto-scales (the maximum tick would be…
Nicolas Berthier
  • 459
  • 1
  • 8
  • 17