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
0
votes
1 answer

D3 NGX Line Chart appearing to have a height when it shouldn't

I'm having a strange issue with my ngx-charts line chart. If you take a look at the GIF below, you'll see 2 line charts. The first one has the bug, the second one is fine. The values for the first chart total out to be zero., yet the chart appears…
Lansana Camara
  • 9,497
  • 11
  • 47
  • 87
0
votes
2 answers

ngx chart scale/range value in units

As per the attached snapshot scale/range of the heatmap is displaying the data values. Need to display value in units i.e like 2140000 to be displayed as 2 GB. Code Sample -- export class App { //single: any[]; multi: any[]; // Size to be…
Manhar Sapra
  • 659
  • 1
  • 11
  • 21
0
votes
1 answer

How to call Center and Fit In View pragmatically on ngx-graph

In this ngx-graph live demo, under the Options section, there are buttons to Center, Fit In View, etc. I would like to implement these in my solution. However, I cannot find any documentation on how to make these calls, and the demo doesn't…
Martyn
  • 1,446
  • 2
  • 19
  • 30
0
votes
1 answer

Angular 6 service data doesn't populate ngx chart

I'm pulling data from an Angular service and trying to populate and ngx bar chart. export class CustomersComponent implements OnInit { customers: Customer[]; single: any = [ { "name": [], "value": [] } ]; view:…
Seeker C
  • 67
  • 9
0
votes
0 answers

Use checkbox to handler many chart in ngx charts

I have four graphics and I want to use the checkbox to manage them. when I click on a checkbox the graphic should appear and if I click it must disappear. However, my code does not work well because the graphics appear randomly when they are checked…
Avi
  • 19
  • 8
0
votes
0 answers

ERROR TypeError: Cannot read property 'toString' of undefined , ngx-charts

I had previously asked a question here finally I found the solution but there is a problem on the graph we must have 4 charts lines displayed but nothing is displayed, the first chart line (orders series) is the problem and nothing charts lines…
Avi
  • 19
  • 8
0
votes
2 answers

Remove even, odd classes in ngx-chart with multiple data sets?

Is there a configuration within ngx-chart to remove the grey background in the following chart: https://embed.plnkr.co/2eQ9jheOTm8i74vp2EmP?show=preview
crtjer
  • 125
  • 1
  • 7
0
votes
1 answer

Is there a way to use Ngx-Charts with Aurelia framework?

I want to use some of the charts by ngx-chart in my Aurelia application, is there a way to do this?
J.Smith
  • 11
0
votes
1 answer

Building new release of ngx-charts

I'm attempting to add a personally desired feature for ngx-charts. I got it to work using the standard src directory but, I wanted to build a release version potentially. Here are the steps to reproduce the issue: npm i…
Michael Sorensen
  • 1,850
  • 12
  • 20
0
votes
1 answer

Download/Export HeatMap ngx swimlane chart as image

Download/Export HeatMap ngx swimlane char as image. Refer plunker url https://plnkr.co/edit/2rtX5cueg2hlzmztUbkH?p=preview Need any option/property to download the chart as image Code` export class App { //single: any[]; multi: any[]; …
Manhar Sapra
  • 659
  • 1
  • 11
  • 21
0
votes
1 answer

Best way to create a PDF with angular 2

what is the best way to create a pdf with angular 2? I tried with pdfmake and html2canvas but I have some problems with rendering charts in IE (ngx-charts). So, do you think that another plugin is better? Thanks
Jamil89
  • 165
  • 3
  • 14
0
votes
0 answers

Display value (in units) in Heat Map Scale (swimlane/ngx-charts)

Refer plunker url for the demo. As per the snapshot: Data values are coming the same format they are being fetched. It should have option to display in unit: like 2140000 to be displayed as 2 GB. Code Sample: export class App { //single:…
Manhar Sapra
  • 659
  • 1
  • 11
  • 21
0
votes
0 answers

ngx-charts how to set the y-axis ticks width

I'm currently using the ngx-charts library to display some data. One UX problem I found is, due to the length of the y-axis ticks change(f.e 1000 and 100000), the chart will flick before the redraw. I'm wondering if there is a way to set the width…
MaXon
  • 465
  • 2
  • 8
  • 17
0
votes
1 answer

Accessing 'this' inside Typescript raw function

I have an Angular 6 app that uses the excellent ngx-charts framwork to display charts. This charting component lets me specify a tooltip formatting function like so:
caitlin
  • 2,769
  • 4
  • 29
  • 65
0
votes
2 answers

Custom color for specific serie using ngx-charts

I'm using the Angular wrapper for D3.js ngx-charts, I have a Bar Vertical Stacked Graph represented but I need the color of the series to be custom when the series has a specific value. Here is an example of how my results are shaped. [{ name: 'Aug.…