D3js序数轴没有显示所有的勾号

Question

我在d3中实例化一个序数标度并将它与一个轴相关联。该轴随后会附加到页面上的SVG画布上;这里一个片段：

var arange = [1,2,3,4,5]; 
var ticks = ['one' , 'two', 'three', 'four', 'five']; 

var myScale = d3.scale.ordinal(); 
myScale.range(arange) 
    .domain(ticks); 

var myAxis = d3.svg.axis() 
     .scale(myScale) 
     .orient("bottom"); 

canvas.append("g") 
.attr("class", "time axis") 
.attr("transform" , "translate ("+myOrigin[0]+" , "+myOrigin[1]+")") 
    .call(myAxis); 

如果我后来改变比例（添加另一蜱和相应的范围，即人气指数= [1,2,3,4,5,6]和蜱= [“一个”， 'two'，'three'，'four'，'five'，'six']），轴的长度正好达到新的范围，但并不是所有的蜱都被绘制出来：最后有些丢失。

请问您能否赐教？

Answer 1

强制D3显示所有标签的唯一方法是明确地将它们设置为刻度值。在你的情况下，这是这样的：

var myAxis = d3.svg.axis() 
    .scale(myScale) 
    .tickValues(ticks) 
    .orient("bottom");