chart.js2 Questions

5

I'm working on my first Cordova projects and am trying to use Chart.js. The documentation states that Chart.js should be included like this: <script src="Chart.js"></script> &...
Bicycle asked 31/1, 2017 at 20:38

13

Solved

I am using Chart.js v2 to draw a simple line chart. Everything looks fine, except there are grid lines that I don't want: The documentation for Line Chart is here: https://nnnick.github.io/Chart...
Intermission asked 17/4, 2016 at 12:6

8

Solved

I'm making a homepage using, Bootstrap, JQuery and Chart.js (v2). I had my implementation working using v1, but recently just got into Bower and downloaded v2 using that. I'm making a grid of 4 co...
Piecework asked 20/4, 2016 at 16:11

11

Solved

I have the following code to create a graph using Chart.js v2.1.3: var ctx = $('#gold_chart'); var goldChart = new Chart(ctx, { type: 'line', data: { labels: dates, datasets: [{ label: 'I want...
Legitimatize asked 13/5, 2016 at 7:52

8

Solved

I'm trying to show some data using a doughnut chart from Chart.js2. My current chart looks like this: My desired output must show another attribute, which is the percentage, and looks like this: ...
Stockman asked 25/4, 2017 at 7:44

15

Solved

I have a bar chart where I have drawn 3 vertical lines, each with it's own label at the top. I would like those labels to be above the top of the y-axis (above the 30% line in the example) but belo...
Woodard asked 3/3, 2017 at 18:16

5

Solved

I am using Chart.js 2.8.0 trying to get rid of the X/Y axis border. With gridLines { showBorder: false }} I am still seeing the X axis border. I also have the color set to 0 alpha, all the other li...
Aliaalias asked 11/4, 2019 at 3:38

5

I have chart which show 3 types of label I want to keep two of them and want to hide one Invoice Income Report. How can I hide that one label? I am using chart.js v2 var myChart = new Chart(ctx, {...
Katharina asked 14/6, 2021 at 10:3

10

Solved

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 th...
Shoa asked 10/11, 2016 at 8:23

2

Solved

EDIT: Modified to add options, and a suggested (from the answer) chartClickEvent, here is a jsfiddle: http://jsfiddle.net/jmpxgufu/174/ Imagine if you will a Chart.js mixed chart with the followin...
Cassaundracassava asked 10/10, 2017 at 17:50

5

Solved

According to the "Tick Configuration" of Chart.js version 2.3 it is only possible to set a padding for the ticks on the Y-axis ("horizontal scale"): padding | Number |10 | Padding between the ti...
Cabot asked 9/11, 2016 at 21:9

5

Solved

I'm Working on Chart.js, wanted to implement Select All and Unselect All option for labels. I'm trying to find it out but couldn't get anything such. Please do help me out if anything such featur...
Ostrich asked 13/3, 2018 at 6:49

2

Solved

I've create a line chart with chart.js. I changed the legend symbol form from rects to circles by using: legend: { display: true, labels: { usePointStyle: true, }, } I want to change the si...
Corelation asked 25/2, 2019 at 11:45

4

Solved

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...
Sanitation asked 3/8, 2016 at 19:37

2

Solved

I'm generating a pie chart with legend that looks like so: As you can perceive, the pie is pitifully puny. I prefer it to be twice as tall and twice as wide. Here is the code I am using: var ...
Trochaic asked 29/9, 2016 at 16:40

3

Solved

I've been trying to add a vertical line that shows up with a tooltip when hovering over the chart. But I'm using chart.js 2.6 and the syntax from 1.x seems to be outdated. I've the following code w...
Bedaub asked 18/7, 2017 at 7:9

2

Solved

Here is a Grouped Horizontal Bar Chart: http://jsfiddle.net/jmpxgufu/185/ var ctx = document.getElementById("myChart").getContext("2d"); var chart = { options: { scales: { yAxes: [{ barPerce...
Cowrie asked 3/11, 2017 at 1:31

6

Solved

I have worked with chart.js 1.0 and had my doughnut chart tooltips displaying percentages based on data divided by dataset, but I'm unable to replicate this with chart 2.0. I have searched high an...
Thiamine asked 16/5, 2016 at 15:1

2

Solved

I am migrating chart.js to 3.x as per the migration guide. https://www.chartjs.org/docs/master/getting-started/v3-migration/ I am trying to set the xAxis zeroLineColor to "#FFFFFF" and I ...
Sum asked 20/9, 2020 at 8:31

2

Solved

This is my first time working with Chart Js and I managed to get it displaying on my page but the keys 'label', 'backgroundColor', 'borderColor', and 'borderWidth' won't display. The keys 'labels' ...
Postfix asked 6/8, 2016 at 3:49

4

Solved

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...
Wilow asked 18/5, 2017 at 14:13

4

Solved

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 Ch...
Plover asked 2/8, 2016 at 15:37

3

Solved

I am creating a stacked bar graph but I need it to not just add the two vales together and display it. For example: stackgraph This graph is supposed to display the "goal" percentage, and actual ...
Flyboat asked 15/6, 2018 at 19:51

2

Solved

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...
Dorton asked 4/8, 2016 at 20:47

4

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.
Magnetite asked 25/1, 2017 at 23:4

© 2022 - 2024 — McMap. All rights reserved.