The ng-2 charts library wraps the Charts.js library to make it easily accessible in Angular 2+.
Questions tagged [ng2-charts]
530 questions
6
votes
5 answers
ng2-charts: Setting colors not working
My chart is defined as:
I have colors specified…

BBaysinger
- 6,614
- 13
- 63
- 132
6
votes
6 answers
Dynamically updated ng2-charts
Is it possible to update any chart from ng2-charts dynamically? I know there are other libraries like angular2-highcharts, but I would like to handle it using ng2-charts. Main question is how can I redraw chart, after button click? I can resize…

ulou
- 5,542
- 5
- 37
- 47
5
votes
0 answers
Zoom a div/canvas element in angular on click
Trying to achieve zoomooz plugin like functionality in Angular . Since npm does not support zoomooz. Is it possible to have same functionality i.e. animated zoom on click. I am using Angular 6 with ng2 charts and want to zoom the div/canvas section…

Manhar Sapra
- 659
- 1
- 11
- 21
5
votes
4 answers
Angular2 Update ng2-charts with labels
I am starting to work these days with Angular2, and have a question with the framework ng2-charts.
Here is my component.ts code :
import { Component } from '@angular/core';
import { ChartsModule } from 'ng2-charts';
import { PredictionService } from…

ben
- 398
- 1
- 6
- 15
5
votes
1 answer
ng2-charts\ng2-charts.js does not export ChartsModule
I am trying to use the basic example of NG2-Charts (http://valor-software.com/ng2-charts/)
I copy pasted the HTML part
5
votes
4 answers
Ng2-charts app not showing charts
I followed the instructions on the ng2-charts demo page to get set up. I'm using angular-cli so I also imported the packages using System.JS. Then I copied the demo code, but it won't display. The canvas is being created but no chart is being…

Alex Kibler
- 4,674
- 9
- 44
- 74
5
votes
1 answer
Angular 2 chart - change point radius
I'm using ng2-charts (https://github.com/valor-software/ng2-charts) to create a linechart for my Angular 2 application. The chart works fine - when you hover over a point, the point automatically changes to white to illustrate that it is being…

Roka545
- 3,404
- 20
- 62
- 106
4
votes
1 answer
ng2-charts and chart.js Error 0x80004005 (NS_ERROR_FAILURE) computeLabelSizes only in Firefox
In an Angular/Ionic project, I am totally bamboozled by the following error.
ERROR:
ERROR Error: Uncaught (in promise): [Exception... "Failure" nsresult: "0x80004005 (NS_ERROR_FAILURE)" location: "JS frame ::…

tahaerden
- 121
- 1
- 10
4
votes
2 answers
Can't bind to 'chartType' since it isn't a known property of 'canvas' with angular12
I have created angular 12 application and trying to include barchart with my application using 'ng2-charts and chart.js'
I have imported NgChartsModule in both app.module.js and my component.module.js file. But, Still I am facing the below error
"…

RajiK
- 71
- 1
- 5
4
votes
1 answer
How to dynamically use chartjs-plugin-annotation with ng2-charts?
I'm creating a statistic page where I need to display several charts, I made a DynamicChartComponent which covers the bar- and line-chart from the demo here(https://valor-software.com/ng2-charts/#DynamicChart).
One of the charts needs to display an…

Basvdh
- 43
- 4
4
votes
2 answers
TypeError: Cannot read property 'legend' of undefined | Angular + ng2-charts
I'm getting a TypeError: Cannot read property 'legend' of undefined when trying to display example data for a chartjs chart in angular.
I've tried using different examples or chart types, but it keeps throwing this error.
HTML:

f5172c0d83892c41b60de3f1fadd89
- 227
- 4
- 13
4
votes
2 answers
Using chartjs-plugin-annotation with ng2-charts
Using charts.js, chartjs-plugin-annotations and ng2-charts in angular 2 project, I need to annotate a line chart with a box annotation as in the figure bellow.
Everything seems fine, except of the box annotations (red) that do not appear on the…

hayordi
- 119
- 1
- 8
4
votes
2 answers
How to set ticks on axes dynamically with chart.js?
We have values which can vary when the site is loaded and we want to dynamically set the tick step size. We have two datasets with differing units in the same chart and want to have the horizontal gridlines match each other. On one side it's a scale…

Keya Kersting
- 135
- 1
- 1
- 8
4
votes
3 answers
ng2-charts: How to set Title of chart dynamically in typescript
Using "ng2-charts": "^1.6.0".
I have a line chart like this:
4
votes
1 answer
Chart.js Doughnut Chart Sizing
I'm using ng2-charts in an Angular project. I have two versions of the project. The current production version is old and using an old version of ng2-charts (and, by extension, chart.js). I'm working on upgrading the project. I've run across…

pjlamb12
- 2,300
- 2
- 32
- 64