Stack Overflow
Stack Overflow

Questions tagged [ngx-charts]

ngx-charts is a charting framework for Angular 2+. It uses d3.js for math functions, scales, axis and shape generators, etc and Angular to render and animate the SVG elements of a graph.

Declarative Charting Framework for Angular2 and beyond

gx-charts is unique because we don't merely wrap d3, nor any other chart engine for that matter. It is using Angular to render and animate the SVG elements with all of its binding and speed goodness, and uses d3 for the excellent math functions, scales, axis and shape generators, etc. By having Angular do all of the rendering it opens us up to endless possibilities the Angular platform provides such as AoT, Universal, etc

Resources

https://github.com/swimlane/ngx-charts

248 questions
2
votes
1 answer

ngx-charts heat map customize tooltip with tooltipTemplate

I tried to customize the tooltip of ngx-charts-heat-map with this code

{{getFlag(item.name)}}

{{item.name}}: {{item.value}}

 I realize this work just fine if…
Primawan Damarjati
  • 115
  • 3
  • 11
2
votes
2 answers

ngx-charts : On click pie chart slice, clicked slice should become active

I am using ngx-chart 5.3.1 & angular 4.1.1. I am tying to highlight a particular slice in the pie chart when click. On page load, I have given static array this.activeEntries = [{"name" : "users" , value:4}]; It is highlighting the particular…
manisankar
  • 41
  • 2
  • 11
1
vote
1 answer

ngx-charts tooltip is not showing up properly when we bootstrap application with progress spinner

I am trying to use ngx-charts library for showing charts and tooltips are not showing up correctly for all ngx charts. Since my application has material spinner loader which is bootstrapped in application. I think root cause of this issue may be the…
Prashant Biradar
  • 301
  • 5
  • 14
1
vote
1 answer

How do I invert colours on ngx-charts-heat-map

I'm using ngx-charts-heat-map to create a heat map. This is all going well enough, the map works, however, one small detail I can't figure out. At the moment the higher the value of a cell, the more red it gets, and the lower the value, the less red…
David O'Brien
  • 813
  • 1
  • 9
  • 18
1
vote
1 answer

How to prevent Error: attribute x: Expected length, "NaN" occurs when declaring empty chart

I want to declare an empty line chart or clear the line chart data by simply emptying the chart data array. With this line of code in typescript:
AkiZukiLenn
  • 337
  • 3
  • 14
1
vote
0 answers

How to apply spacing between chart and the label in ngx line chart

I have been facing an issue where I have X and Y axis label, when ever I zoom in or zoom out a page sometimes the label gets overlapped with the X and Y axis data. Refer the below image for reference . There is no space between the value and…
RonKing
  • 31
  • 3
1
vote
0 answers

Custom label text on ngx pie chart

Is it possible to change the labels that are on an NGX Pie Chart? You can see what I mean by labels in the picture below and also in this stackblitz. I would like to pass an array with four elements containing custom text, for example the percentage…
Chris
  • 124
  • 9
1
vote
0 answers

Bars get stacked in ngx vertical 2d bar chart

I am trying to add data to my ngx vertical 2d bar chart, but the bar in x axis is displayed in stacked format rather than displaying it in separate bar . [results]="multi" my data multi…
RonKing
  • 31
  • 3
1
vote
0 answers

Angular ngx-charts-bar-vertical-2d bracket values for y-axis

We are trying to implement a vertical bar chart using ngx-chart; currently it works with numerical values on the y-axis
SALIM
  • 11
  • 1
1
vote
1 answer

How to invert the y-axis in ngx-chart line chart

If we look at the ngx-charts line chart demo, we can see the y-axis displayed by default as: Is there a way to invert the y-axis, so that it looks like this instead?
katyusha
  • 151
  • 1
  • 11
1
vote
1 answer

How do I use customColor in ngx-charts to change the graph color according to data value?

I am unable to use the customColor attribute to change the color of some of my datapoints dynamically. I am using ngx-charts. I followed the docs, but my colors didnt change. Here is my code: lineCustomColor() { for (let i = 0; i <…
ritwick_ _D
  • 117
  • 1
  • 11
1
vote
0 answers

ngx-charts: Is there a way to add custom vertical line or popup tied to a certain y-axis value?

What the title says. I would like to add something constantly visible (line, tooltip, ...) which is connected to a value on y-axis (in this case to a date). Is there any way to do this in any shape or form? Symbolic picture:
Gašper Štepec
  • 115
  • 1
  • 1
  • 7
1
vote
0 answers

ngx-charts-bubble-chart respond slow

I was doing bubble ploting with ngx-charts. Things are working, but when I was trying to do with >2000 data points, it respond very slow. Did I miss anything there? Splitting data might be the last thing I want to try in this case. Is there any…
Mavershang
  • 1,266
  • 2
  • 15
  • 27
1
vote
1 answer

Is there a way to change the color of a reference line in ngx charts?

I am doing an ngx-line-chart and added a line using the referenceLines input. The issue is that the line is barely noticeable as by default it is coming out in the same color as the but more opaque. I've tried using the customColors property as…
Beto Shiver
  • 39
  • 1
  • 4
1
vote
1 answer

ngx graph - Store the state of the graph after repositioning some nodes

The ngx-graph is used to draw flow diagram in angular. The algorithm automatically aligns the nodes with proper spacing. Also there is a feature to drag the nodes from their initial positions But on page refresh all the changes made by the user are…
Abdul K Shahid
  • 504
  • 1
  • 4
  • 17
1 2 3
…
16 17