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

How to chage ngx-bar chart color using customColor?

I am trying to change the colour of my ngx bar chart by calling a function at [customColor] property but it is going into loop even though by animation mode is off. I had referred to the following StackOverflow answer and even on a comment section,…
yogesh Ratudi
  • 11
  • 4
0
votes
0 answers

Angular, ngx-charts. Print in firefox

If the page using @media print will be printed in Firefox, ngx-charts's bars are losing their colours. In Google Chrome I can get a page that has been printed right. Examples: Google Chrome Firefox The pictures are screenshots of print reviews in…
uhetz
  • 382
  • 3
  • 11
0
votes
2 answers

Format the value of a Ngx gauge chart to display a percentage

I have to format the value displayed in the middle of the gauge chart. I need the average value of five data to be displayed in middle as percentage. In the documentation it shows that using valueFormatting we can format the value. Can anyone…
Karthik
  • 1
  • 1
  • 1
0
votes
1 answer

Ngx-Chart skip focus when tabbing page

I have a chart (ngx-charts-pie-chart) which gets focus when i use tab on my page. I want to exclude this component completely from the natural taborder of my page. I have tried a lot of things including inert. Does anybody have any suggestions to…
dotnet-provoke
  • 1,308
  • 14
  • 25
0
votes
1 answer

Got "error TS2304: Cannot find name 'id'." when tried to test "ngx-diagram" example

I am trying to test the simple ngx-diagram example from here: https://www.npmjs.com/package/ngx-diagram But when I run my code it gives me these error messages: ERROR in src/app/app.component.ts:23:26 - error TS2304: Cannot find name 'id'. 23 …
Hasani
  • 3,543
  • 14
  • 65
  • 125
0
votes
1 answer

Angular ngx-chart: Object not iterable

I have problem with Anguler ngx-charts. I am trying to plot data and still getting error: ERROR TypeError: data is not iterable. If I use this data defined in ts file, plot shows correctly. public data = [ { "name": "Požadovaný prùtok…
Rosta6
  • 161
  • 1
  • 4
  • 10
0
votes
1 answer

Ngx-charts multi series line-chart

I am trying to create a multi series line chart in angular using Ngx-chart module but currently am at a stand still with the following issue: When sending Date() formatted data as the "name" (x-axis) field, the data are pre-formatted to a…
Kevin Alovega
  • 50
  • 1
  • 6
0
votes
1 answer

ngx chart angular x Axis show time only 4 options

i am new at ngx-charts . i am trying to show ngx-chart-line i am trying to show in my xAxis - time (format - hh:mm) . but i want only to show 4 options on my xAxis for ex : 10:00 12:00 16:00 19:00 i have tried fix it with loop and…
Lital Kaminsky
  • 75
  • 1
  • 9
0
votes
1 answer

Angular (ngx charts) pass optional input

I am starting with Angula 8 and ngx-charts. I want to display graphs from configuration files. To do that, I allow the configuration file to provide several graphics options (basicaly, almost all options from…
dufaux
  • 681
  • 2
  • 8
  • 18
0
votes
0 answers

How to pass some variables from one component to other in Angular?

What I want to do is creating an array using setRsi() function, then plotting it using doOutput() function that opens a new dialog for showing the result using ngg-charts component. This is flow.component.ts file and setRsi() method is a click-event…
Hasani
  • 3,543
  • 14
  • 65
  • 125
0
votes
0 answers

NgxChartsComponent_Host.ngfactory.js? [sm]:1 ERROR TypeError: Cannot read property 'map' of undefined

This is the content of stock_inf.ts file(Actually there are bigger and different arrays, but just for summery i Put these similar arrays): export const Mellat = [1789.35, 1762.42, 1770.88, 1771.65, 1776.27, 1766.26, 1706.23]; export const Khodro=…
Hasani
  • 3,543
  • 14
  • 65
  • 125
0
votes
2 answers

Hide/Show the corresponding data from the chart on legend click ngx-charts

I am working with angular 6 and ngx-chart and I need on clicking the legend item, the corresponding data from the chart should show/hide The ng-chart library does have this functionality and my client requests it. Edit01: I have almost everything…
Manolait
  • 353
  • 2
  • 11
0
votes
1 answer

ngx-charts library: How to change space between y-axis and first group in bar chart

I am working with ngx-charts trying to vizualise some data in a combo-chart of barcharts and line charts. I have most issues worked out, but I cannot figure out what I should change in my code to control the space between the y-axis of my chart, and…
J M Smith
  • 25
  • 1
  • 11
0
votes
0 answers

ngx-charts-line-chart freezes after several minutes

I included four ngx-charts in a template, two pie-charts and two line-charts. Data are fed by async pipes for all of them. Since we need to keep these data up-to-date, a new "results" list is pushed into each async pipe every 5 seconds. The first…
Alan Del Piccolo
  • 1
0
votes
0 answers

How to freeze Y-axis label & make X-axis Scrollable for Angular Ngx-chart Bar Chart

I would like to produce an Ngx-chart - Stacked Vertical Bar Chart (which is already successful) with a freeze Y-axis when I'm scrolling to the right, whereby the X-axis will continue to scroll, but the Y-axis will stay to indicate me the current…
Adam
  • 1
1 2 3
…
16 17