Get a list of axis ticks with final formatting applied
How do I get a formatted list of tick values from D3 as they will appear when the axis is rendered?
For example:
var x = d3.scale.linear()
.domain([0, 0.061])
.nice();
var xaxis = d3.svg.axis()
.scale(x)
.tickFormat(d3.format('.1%'));
console.log(x.ticks()); // [0, 0.005, 0.01, 0.015, 0.02, 0.025, 0.035...
console.log(xaxis.ticks()); //[10]
But I really want something like:
["0.0%", "0.5%", "1.0%", "1.5%", "2.0%", "2.5%", "3.0%", "3.5%", "4.0%", 4.5% ", "5.0%", "5.5%", "6.0%", "6.5%"]
+1
source to share
1 answer
This approach seems to work:
x.ticks().map(function(t) { return xaxis.tickFormat()(t); })
But this is a pretty painful syntax. If anyone knows a better answer using built in methods please post it.
This looked promising:
xaxis.tickValues()
But it seems like it is only meant to pass values to . If you call with no parameters, it returns null.
+1
source to share