software_writer
software_writer

Reputation: 4478

D3 tickValues not working

I have following D3 axis:

var x = d3.scale.ordinal()
.domain(["A", "B", "C", "D", "E"])
.rangePoints([0, width]);

var xAxis = d3.svg.axis()
.scale(x)
.tickValues(["a", "b", "c", "d", "e"])
.orient("bottom");

working fiddle here: https://jsfiddle.net/akshayKhot/1vusrdvc/

The tickValues are not showing other than the first one. Am I missing something?

Upvotes: 0

Views: 809

Answers (1)

Fiver
Fiver

Reputation: 10165

You need a range value for every one of your ordinal values:

var x = d3.scale.ordinal()
    .domain(["A", "B", "C", "D", "E"])
    .range([0, 1/4 * width, 2/4 * width, 3/4 * width, width]);

https://jsfiddle.net/39xy8nwd/

Upvotes: 1

Related Questions