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);

如果我后来更改了比例（添加另一个刻度和相应的范围，即arange = [1,2,3,4,5,6]并且ticks = ['one'，'two'，'three'， '四'，'五'，'六']）轴的长度是正确的到达新的范围，但并非所有的刻度都被绘制出来：最后的一些以某种方式丢失了。

你能告诉我吗？

Answer 1

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

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

D3js Ordinal Axis未显示所有刻度

1 个答案: