ngx charts: Line chart define line width

Question

I'm using ngxChart for a project, everything is fine, but I just find the line width very thin and I just can't figure out how to get it bigger.

Any help?

It's on line graph, and it's just the line draw by the graph that I can't set bigger. Not X or Y axis, just the line itself — Hadrien Delphin, Mar 27 '20 at 16:38

score 12 · Accepted Answer · answered Jun 15 '20 at 05:42

Add the following rule to your global styles.scss file:

/* Make lines in line chart thick, with rounded ends */
g.line-chart > g:last-of-type > g:nth-child(n) g.line-series > path {
  stroke-width: 10;
  stroke-linecap: round;
}

The n in g:nth-child(n) can be replaced with a number that references the number of the line that you want to modify (e.g. 0 for the first line), or something like 2n for every second line.

And obviously the width of 10 can be changed to any width.

ngx charts: Line chart define line width

1 Answers1