Questions tagged [chart.jsv3]
25 questions
7
votes
1 answer
Chart.JS tooltip callbacks label and title (v3.5)
(Please note: There are lots of answers for v2, this is for v3)
I'm trying to setup tooltips label and title for a doughnut chart.
Code:
//Create the donut chart
donut = new Chart('questions_positivity_donut', {
type:…
Izzi
- 2,184
- 1
- 16
- 26
4
votes
1 answer
Using chart.js version 3, How do create Custom Labels with Links?
I'm using Charts JS and I'd like to create some custom Labels on a Stacked Bar Chart. I'm trying to recreate this following chart:
How do I create custom labels as circled in Red above? I'd like to link to other pages with these labels. Actually…
Rodney Hickman
- 3,133
- 11
- 53
- 83
3
votes
1 answer
chart.js add second line in a Line chart that starts from end of first line
Im using chart.js and I have a line chart.I want to add a second line/dataset that starts from where the first line ends.
Ive seen people do this by adding null in the data property inside the datasets like this:
type: "line",
data:…
leon100
- 55
- 6
2
votes
2 answers
Chart.js bar thickness
I need help on bar thickness using chart.js v3.5
Issue: I set the bar thickness "barThickness: 55," and after in responsive I don't know to manage it in responsive
here is my code which I have used, Please let me know what should I do for the…
Hiren
- 21
- 1
- 4
1
vote
1 answer
ChartJs: is it possible to show lesser or a certain data point on line?
For instance, the attached figure it is showing ALL points as circles. What If I want to show the last data point on each line? is it possible?
Volatil3
- 14,253
- 38
- 134
- 263
1
vote
0 answers
Why isn't the legend changing after I have changed the data?
I have made a Drill down bar chart using help of yt videos and forums utilising. However, I have noticed that when you change into a different data set. The legend doesnt really change.
Please see the example below with the code so you can make…
safalstha
- 3
- 4
1
vote
0 answers
Chartjs v3 - Add a glow effect on hover to the arcs of the doughnut
I need to add a glow effect on hover to the doughnut chart I created. An example of the same can be found here - https://nagix.github.io/chartjs-plugin-style/samples/doughnut.html
The above link plugin works only with chart.js V2, but not with…
sjathin
- 11
- 3
1
vote
1 answer
Chartjs: Moment and ChartJS Time Format Parsing
I need to make a bar chart using the time format, I started this one as a base but the library version is old and I need to use the new one but it is not working, can someone help me?
Values must be in hours:minutes:second timeframe.
here is the…
Rod
- 57
- 5
1
vote
1 answer
Manipulating data point in chart.js external tooltip
I'm using Chart.js to display some financial data in a pie chart, along with external tooltips. The data in the tooltip is displayed currently like this:
"Invoiceable: 1,202.5"
What I want is to firstly round the number to 1,200, and then add a…
theboyler
- 23
- 3
1
vote
1 answer
chart.js remove lower grid from mixed chart
I have a mixed chart (scatter and line), hence I need 2 xAxis.
There's an extra grid that appears on the bottom of the chart, because that's where the other x axis normally has its labels (I removed them because I don't need them)
I'm trying to get…
Sergio
- 658
- 1
- 9
- 22
1
vote
1 answer
How to display specific data range on my chart's dataset using Zoom and Pan on Chart.js 3.+?
I have a line chart for messages sent x day/month and I also have two datepickers on top of it. I want to be able to select a start date, an ending date and the chart reads those dates and display this exactly range of points.
I already have zoom…
1
vote
1 answer
Chartjs v3 overlap stacked bar chart with groups
I want to create stacked bar chart with groups in use chart.js v3. I
my chart output
I did it and i am getting the following image. But here, instead of the sum of label 1 and label2 appearing as 7000, how can I show the intersection of label 1 and…
user3176661
- 13
- 3
1
vote
1 answer
Cursor pointer change onhover not working in chartjsv3
I am trying to change the cursor to pointer when we hover on the bar chart created using chartjs(v3) library. But I'm not able to do it with the following code:
user1188867
- 3,726
- 5
- 43
- 69
0
votes
0 answers
x axis unit value changes not reflecting on graph
I am trying to change unit of x axis time scale on dropdown change but graph is not displaying as per the changed unit. Below is the code where this.unit is 'minute' or 'hour' or 'day' or 'week'
this.lineChartOptions.scales.x = {
type:…
Nilam
- 1
0
votes
1 answer
How to increase the line width when hovering the cursor in chart.js?
I know that I can change the width of the line and its points with borderWidth: 1, pointRadius: 1, it works fine.
But how to increase the width of the line and its points when hovering the mouse cursor over a line?
I tried hoverBorderWidth: 2,…
Neret
- 143
- 1
- 8