The ng-2 charts library wraps the Charts.js library to make it easily accessible in Angular 2+.
Questions tagged [ng2-charts]
530 questions
4
votes
1 answer
Angular 2 ng 2 Charts How to change x axis values dynamically?
I can change the values in y axis, But I want to change x axis values.
I want ['step1', 'step2' .... ] these values in x axis.
I attached my full code.
I am using ng 2 charts in angular 2.
I want to create horizontal bar chart.
NPM Install…

Balu
- 484
- 1
- 5
- 19
4
votes
0 answers
How to write text to insede doughnut chart in angular 2
I use ng2-charts doughnut chart, I want write 15$ to insede but can't. Please help me. Thank you very much.
html
4
votes
1 answer
NotYetImplemented error ng2-charts
Getting an error with message "NotYetImplemented" from utils.js .
I get the error while using nodejs server, what this exact error means?
When I'm using "ng serve" there is no such error.
I'm using line chart from ng2-charts module.
Full Stack…

hagai
- 424
- 1
- 7
- 13
4
votes
1 answer
Multiple charts on same page not working - ng2-charts
I have used 2 doughnut charts on the same page as shown below,
There are 2 problems,
1. color (No Color for the second chart)
2. datasets. (Even if the data is different for both the chart still it picks the same data for both charts.)
HTML

Jayesh
- 6,047
- 13
- 49
- 81
4
votes
1 answer
ng2-charts empty initial dataset
I am experimenting with ng2-charts using Angular 2. I started by following the example to create a line chart. It initialises the chart using a dataset as follows:
public lineChartData:Array = [
{data: [65, 59, 80, 81, 56, 55, 40], label:…

user1849060
- 621
- 3
- 10
- 20
4
votes
0 answers
Tooltip gets cut off from ng2-chart
I'm trying to fit line charts into some very small table cells:
As you can see, the rightmost point's tooltip gets slightly cut off. This is the only one that causes a problem.
The easiest fix would probably be to put a higher z-index on the…

Jesper
- 2,644
- 4
- 30
- 65
4
votes
3 answers
Angular 2 ng2-charts donut change segment color
This is question related to link
I am trying to create component with donut chart and pass input parameter color to set the segment of donut color. I am doing initialization of chart in ngOnInit(). Color is changed for hover(hoverBackgroundColor)…

playerone
- 987
- 3
- 22
- 44
4
votes
1 answer
ng2-charts bar charts displaying values at the end of the bar
I am using ng2-charts to display very basic charts. I am using horizontal bar charts and I need to display values at the end of bars. I couldn't figure out how to do that?
See image
Following is my html and options:
4
votes
1 answer
how to set chart.js grid color for line chart
I want to change the grids color of my line chart using options field but I have no idea from where to begin.
I First tried to change the canvas backgroud colors using gradient but the results weren't good.
canvas{
background:linear-gradient(top,…

PhiloJunkie
- 1,111
- 4
- 13
- 27
4
votes
1 answer
ng2-chart.js tooltip always showing
How to set tooltip using ng2-chart always visible? At char.js is option showTooltips: true, but I can't find ng2-chart solution.

Namida
- 43
- 1
- 5
4
votes
1 answer
Is there a way to hide/customize ChartJS' above legend?
I'm using ChartJS in my project (more exactly ng2-charts for Angular 2 built on top of the original library).
I see there is an option:
legend: false|true
However I find particularly annoying tot to be able to remove the upper legend (which…

dragonmnl
- 14,578
- 33
- 84
- 129
3
votes
2 answers
NG2 Chart with Angular: Can't bind to 'colors' since it isn't a known property of 'canvas' in Angular 13
Template
Code:
public chartColors: Array = [
{
…

Tushar Maheshwari
- 68
- 1
- 8
3
votes
1 answer
Some imports are missing in ng2-charts@3.0.8
I have recently update chart.js from 2.9.4 to 3.6.0 and ng2-chart from 2.4.3 to 3.0.8.
I have followed the migration guide from chart.js to migrate to v3.X
I've update my imported module from import { ChartsModule } from 'ng2-charts'; to import {…

E-Mohamed
- 105
- 9
3
votes
2 answers
How to colorize individual rings in polar chart background in chart.js/ng2-charts?
I am trying to change the color of individual polar chart rings using chart.js version and ng2-charts in Angular but in the documentation of particular versions, I haven't found anything related to it and neither searching the solution on…

Muhammad Ahsan
- 608
- 15
- 28
3
votes
2 answers
ng2-chart: How to show percentage values inside the chart?
I've been googling for hours but didn't find the answer for this yet. I'm using ng2-chart to generate charts in my dashboard. It's working well, the problem is that I want to show the percentage values inside the doughnut chart but I don't know how…

Andre
- 431
- 7
- 23