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

Remove time from ngx-line-chart

This should be simple, but I can't find it anywhere. My charts have started showing the time in the xAxis like this: Notice how the points in the line graph all land on a day, so I have no idea why it's showing time at all. The API I am calling…
r3plica
  • 13,017
  • 23
  • 128
  • 290
3
votes
2 answers

Angular 12 - is not assignable to type '[number, number]

I am trying out ngx-charts library in Angular 12 and I keep getting this issue: Type 'any[]' is not assignable to type '[number, number]'. Target requires 2 element(s) but source may have fewer. I don't know what the error means. Here is the…
yea2021
  • 67
  • 1
  • 9
3
votes
1 answer

ngx-charts results/data array update issue in angular

Am using ngx-charts-bar-horizontal in my angular 8 project. It is working fine when i load the results/data array in ngOninit function. But I want to change the existing data on click of a button. it loads a new data to…
Sharath Au
  • 39
  • 6
3
votes
1 answer

show value on ngx-charts heat map

I am working with ngx charts to show the data in Heat Map. Its working fine without any issues. Working Example | Heat Map But I want to show the each grid values instead of showing it on mouse hover. Is there any way to do that? I checked the…
IamGrooot
  • 940
  • 1
  • 17
  • 44
3
votes
0 answers

Ngx-Charts show all x axis values but alternate x-axis labels

I am currently working on ngx charts, for examples i have 12 x-axis every values need to be plotted in graph, but only alternate x-axis label need to be displayed. html code
kubendran
  • 31
  • 3
3
votes
3 answers

Change default styling of horizontal bars in ngx-charts

I am using ngx-charts [Link to Github Repo] for charting purpose in Angular. I am using version 8.x of Angular. This package is really easy to use and comes with good features. But, I can't seem to change the default styling of horizontal bars in…
Hope
  • 475
  • 6
  • 16
3
votes
0 answers

Unable to initialize chart's results with API fetched data

I am new to ngx charts and trying to visualize some data. But I don't reach to visualize the data. Can someone help me in this case? usedata.servcie.ts import { Injectable } from '@angular/core'; import { ApiService } from './api.service'; import {…
newbie_nici
  • 31
  • 1
3
votes
0 answers

How to expand chart to match width of container using ngx-charts

I'm trying to use ngx-charts to display an area chart that spans the full width of my page (it's supposed to match the width of the horizontal line above it). However, it appears that when generating a chart there is some sort of padding inside the…
Jordan Lewallen
  • 1,681
  • 19
  • 54
3
votes
1 answer

Angular NGX Chart : adjust X tick number

I am developping un app with some line chart. I use line Chart within "ngx-chart" library . It works, but I would like to have a better display of axis. My data are temperatures values according to date. Actually, the chart display a label for…
Oytoch
  • 153
  • 1
  • 1
  • 15
3
votes
0 answers

Is there a way to synchronize ngx-chart line chart so that when hovering over one, it will hover over the other charts at the same x value?

I am trying to implement multiple line chart from ngx-charts within a container to present data of multiple different types with the same x and y axis and it'd be nice to hover over one and the others will be mouseover with the tooltip displaying…
Huey-H
  • 31
  • 2
3
votes
3 answers

Hide ngx advance pie charts legend

I want to hide the legend of ngx advanced pie chart and show image in the middle of the circle Problem statement: Not able to hide the legend of advance pie chart i want to hide legend and show image in rounded circle with data. plnkr code…
Sarjerao Ghadage
  • 1,420
  • 16
  • 31
3
votes
0 answers

How to customize ngx-charts (line chart) to have tooltips shown always?

Is it possible to customize ngx-charts library to have tooltips displayed always rather than on hover?
skATsof
  • 191
  • 1
  • 1
  • 10
3
votes
0 answers

How to make ngx-charts-gauge tooltip apear near to arc when [showAxis]="false"

i am using ngx-charts-gauge with single result set, i have set [showAxis]="false" as i dont want axis. but on hover of arc tootip displays far away from arc. I tried with #tooltipTemplate as but no luck. below is my chart…
JanakaRao
  • 71
  • 7
3
votes
0 answers

ngx-charts: Automatic sizing does not work correctly in CSS grid or Flexbox

When an array of charts are placed in a grid, each subsequent column in the row produces a chart that is larger than the one that precedes it. It seems that, unless you explicitly specify hard-coded sizes, the chart sizing logic does not work well…
Dan Rullo
  • 323
  • 2
  • 10
3
votes
0 answers

activeEntries not highlighting in ngx-bar chart

I am using ngx-charts in my angular application. I am using a vertical bar chart to display. I am having name as date and value as number, i.e export class VBChartData { name: string; value: number; } The VB chart component is, export…
Anil
  • 1,748
  • 8
  • 32
  • 67
1 2
3
…
16 17