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

Json Data with multiple objects separated ... How to reach a specific object by name

I am using ngx-charts and I am getting plotting some json data on a chat like this: app.component.ts: data1 = [ { "name": "DATA1", "series": [ { "name": "ONE", "value": 0.017 }, { …
deszok
  • 95
  • 1
  • 10
0
votes
1 answer

How to create chart using Springboot Json api

i have this service that give back this Json result : { "MANNOUBA": 1, "Medinine": 4, "Gabes": 5, "Tunis": 22, "Beja": 3, "Kebili": 0, "Sfax": 11, "Laundry Making": 6, "italia": 0, "Sousse": 6, "Desk": 1, "Jendouba": 3, "Mahdia": 6, "Ben Arous":…
Khalil Laouini
  • 33
  • 5
0
votes
0 answers

Ngx-charts only updating on hover

The following code manages to update the results array but the changes only become visible when I hover over the chart as if it only updates on onFocus events. Is there a way to make the chart element update along with the results…
F1shboy
  • 13
  • 3
0
votes
2 answers

How can I achieve timeline filter bar chart with NGX charts?

I've been trying to figure out how to achieve the timeline for x-axis for NGX chart like in documentation demo page: https://swimlane.github.io/ngx-charts/#/ngx-charts/timeline-filter-bar-chart-demo But there isn't anywhere code how it was achieved,…
Hopeless
  • 23
  • 9
0
votes
1 answer

TypeError: data is not iterable , using ngfor on nested array

rowData= [{ "label": "president", "contestants": [{ "name": "john key", "votes": 2 }, { "name": "john hi", "votes": 1 }, { "name": "john kl", "votes": 1 }] }, { "label": "organizer", "contestants": [{ …
Awabil George
  • 310
  • 6
  • 12
0
votes
1 answer

Can't use a locally modified Angular module inside another project

I'm getting the following error when I ng serve (and I've already tried to clear cache, reinstall all modules and reboot the server) Error:…
user11323942
0
votes
1 answer

Less Cannot find variable 'xxx'

I am trying to implement a dark theme in ngx-charts. I am quite new in using less. Below is the code My IDE is complaining Cannot find variable 'color-bg-darker' and compilation fails Error: ./src/styles.less Module build failed (from…
Owen Kelvin
  • 14,054
  • 10
  • 41
  • 74
0
votes
0 answers

how to make date comparison more efficient in javascript/typescript

I have a asynchronous data I am loading from Firebase Firestore with this function graphDataSubscription; //dataCounter; passTotalCalData; totalCalories; dates=[]; caloriesData=[]; getGraphDateCalories() { …
EmreAkkoc
  • 623
  • 1
  • 11
  • 18
0
votes
2 answers

ngx-charts can I set the y axis increment

I have a data set with whole number values less than 5. The ngx-charts y axis shows tick marks at 0, 0.5, 1, 1.5, etc. Is there a way to make it only put tick marks at whole number increments?
Steev0
  • 41
  • 1
  • 7
0
votes
1 answer

swimlane ngx line chart second y axis in angular

I'm trying to create an line chart in my angular project, where i have two y axis. Since I am not very skilled in this area I have tinkered an example, by manipulating the comboBarScheme…
CodeAmi
  • 3
  • 4
0
votes
1 answer

Is there a way to trigger the select event on key press (enter)?

I am trying to make the chart keyboard accessible, and need a way to trigger the "select" event on a keypress. (select)="onSelect($event)" ... I have a function call when there…
Kevin
  • 3
  • 1
0
votes
1 answer

ngx-charts: select data on bar chart and change color via code

I am using ngx-charts for the firs time and I am creating a ngx-charts-bar-vertical chart. I have created the chart successfully but I am wondering if it is possible to select one of the bars by the name value. In particular, my data look like: [ …
umbe1987
  • 2,894
  • 6
  • 35
  • 63
0
votes
1 answer

NGX-Charts bubble chart x-axis spacing issue

I am working on an Angular application that uses ngx-charts bubble chart. The content on the chart is updated as a user narrows in on a time range. I'm using the bubble chart to mark certain events in time on a timeline rather than representing data…
HotWax
  • 83
  • 8
0
votes
0 answers

Want to give different bar color for each series using custom colors

Is it possible to add different color for each series. using customColors? for customColors() { result = JSON.parse('[{"name":"Used","value":"#e8c728"},{"name":"Used","value":"#FF0000"}]'); return result; } Sample…
user1283333
  • 137
  • 1
  • 5
0
votes
2 answers

ngx-charts-advanced-pie-chart is reading my rest api response as null

i'm trying to inject my Rest API response in ngx-charts-advanced-pie-chart, and it's reading it as null this is my product.component.html
…
Maaroufi Aziz
  • 3
  • 2
1 2 3
…
16 17