Questions tagged [chart.js2]

Chart.js is a JavaScript library for creating animated, interactive graphs for inclusion on web pages.

Chart.js2 is a updated and newer version of Chart.js.

See Official Version Documentation for a list of what's new in v2.5.0.

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

438 questions
11
votes
4 answers

Change Chart.js tooltip caret position

I created a doughnut chart using Chart.js 2.5. The issue I’m having is with the tooltip. When I hover over the chart, a tooltip is displayed with a caret that always stays in the left or right side, like this: I want to change the caret position so…
user8010590
11
votes
3 answers

Chart JS Fill Between two lines

I am looking for a way to fill between two lines with Chart.js so that it would look like this. I have looked and everything seems to talk about filling between two lines across zero. I also need other lines to fill all the way down like normal. Is…
Mav2287
  • 796
  • 2
  • 9
  • 22
11
votes
9 answers

How to remove the line/rule of an axis in Chart.js?

I managed to remove all horizontale lines/rules in my chart using this: scales: { xAxes: [{ gridLines: { display: false } }] } But I also want to get rid of the rule/bar that represents the Y-axis as well.…
lampshade
  • 2,470
  • 3
  • 36
  • 74
11
votes
4 answers

Apply/Register conflicting plugins to different charts

I have defined two slightly different Chart.js plugins and I have a page with two different charts. I want to apply the first plugin to the first chart and the second to the second chart. According to the source, there are a register and unregister…
David
  • 763
  • 1
  • 7
  • 14
9
votes
3 answers

how to show multiple values in point hover using chart.js

I want to know that if it is possible to show more values on point hover in chart.js. Have a look in this fiddle. This is a smiple graph example taken from the chart.js site. If i hover a point it shows the dataset value. How can i show other…
tech_geek
  • 1,624
  • 3
  • 21
  • 44
9
votes
4 answers

How do I use plugins in ng2-charts?

I'm not sure how exactly to import a plugin into ng2-charts, specifically the annotation plugin. I'm using Angular2 / Ionic2. There doesn't seem to be any documentation or answers on this.
Daniel Engle
  • 131
  • 1
  • 2
  • 4
9
votes
4 answers

How to add text in centre of the doughnut chart using Chart.js?

I want to create a Doughnut graph with two values. Clicking the graphs should print the value in center. I found a solution in stackoverflow similar to my requirement. I would like to use latest Chart.js library from github. Is this feature is…
jjose
  • 113
  • 1
  • 1
  • 5
8
votes
2 answers

Zoom Function For Chart.js

I have a chart that I want to use the github zoom feature for found here. I am have wrote the code below which runs error free, but when I try to zoom in and out on my mouse wheel it does not work. What code needs to be changed so I can zoom in and…
HotTomales
  • 544
  • 2
  • 6
  • 13
8
votes
2 answers

How to get date label of line Chart?

I use line of Chart.js( Version: 2.7.2 ) in my application and I open dialog when clicking on some element and I need to get label(date on xAxes) of the current element. Googling I found examples and trying to make as next : var lineCanvas…
user2054381
8
votes
7 answers

Chart.js2 Radar, how to configure the label padding/spacing?

I have the following Radar chart using Chart.js v2. My configuration: legend: false, scale: { pointLabels :{ fontSize: 16, fontStyle: "bold", } } The problem here is the "Communication" label has 0 padding between the label…
AnApprentice
  • 108,152
  • 195
  • 629
  • 1,012
8
votes
2 answers

Modifying the X-Axis Labels of a Scatterplot in Chart.js 2

In Chart.js 2 I am generating a scatter-plot where there x coordinates are Epoch timestamps and the y coordinates are integers. I was wondering if there was a way to format the x-axis labels of the graph, so that the dates are displayed in a…
ScottWe
  • 190
  • 1
  • 1
  • 10
8
votes
4 answers

How to add OnClick Event on labels in Chart.js v2.0?

Looking For a method to add onClick handle on the "label" element in chartjs 2.0 As using below method will return "undifined" in console.log whenever clicking on any one of the label attributes in Char.js V2.0 RadarChart. var data = { // below…
infiniteloop
  • 885
  • 2
  • 12
  • 29
8
votes
2 answers

Chart.js v2 charts do not display inside angular 2 (but Chart.js v1 works perfectly)

I am rendering a chart inside an angular2 attribute directive (an approach taken by the angular2 team). This approach works with chart.js but not chart.js 2.x code for attribute directive is ... import {Directive, ElementRef, Input} from…
danday74
  • 52,471
  • 49
  • 232
  • 283
7
votes
1 answer

Chart.js Dynamically Updating Chart with X Axis Time

I'm using Chart.js version 2.7.1 and I am dynamically updating my Line chart when temperature data comes in. The problem is that the lines never pass the halfway mark of the x axis in time. Every time I update, the chart auto scales the right side (…
PhilBot
  • 748
  • 18
  • 85
  • 173
7
votes
1 answer

Chart.JS Mixed Chart - Bars Not Showing

I'm building a graph using ChartJS and the Alpha-Vantage API. And for the most part, it works as expected. But this is only if every dataset is plotted as a line-graph (So my data is definitely there). Thing is, I want my Volume data-set to be bars.…
Krono
  • 1,352
  • 1
  • 14
  • 33
1
2
3
29 30