Ngx-charts: Rounding on Axis Values

Created on 14 Nov 2016  路  2Comments  路  Source: swimlane/ngx-charts

Need some ability to round axis values so Instead of 0, 0.5, 1 ... it just be 0, 1, etc

img

Enhancement Moderate Low

Most helpful comment

We opted for a more generic solution to this problem.

We added xAxisTickFormatting and yAxisTickFormatting inputs to all charts that have X and Y axis.

They accept a function, in which you can return a string that will be displayed in place of the axis tick label.

If you want to hide a label, just return an empty string.

In this particular example, the function to round labels on whole numbers would be:

axisFormat(val) {
  if (val % 1 === 0) {
    return val.toLocaleString();
  } else {
    return '';
  }
}

All 2 comments

I'm dealing with the same issue. This would be very useful to have. Or at least to be able to specify the xScale, xDomain, and yScale, yDomain.
Thank you!

We opted for a more generic solution to this problem.

We added xAxisTickFormatting and yAxisTickFormatting inputs to all charts that have X and Y axis.

They accept a function, in which you can return a string that will be displayed in place of the axis tick label.

If you want to hide a label, just return an empty string.

In this particular example, the function to round labels on whole numbers would be:

axisFormat(val) {
  if (val % 1 === 0) {
    return val.toLocaleString();
  } else {
    return '';
  }
}
Was this page helpful?
0 / 5 - 0 ratings

Related issues

lokeshdaiya picture lokeshdaiya  路  3Comments

emeric0101 picture emeric0101  路  3Comments

Hypercubed picture Hypercubed  路  3Comments

jvbianchi picture jvbianchi  路  4Comments

NashIlli picture NashIlli  路  3Comments