d3.js需要在y轴上重复值

时间:2015-05-05 09:26:59

标签: d3.js gantt-chart

我有一个数组:

taskTypes = [slot1, slot2, slot3,slot4,slot1,slot2,slot6];

我的y轴代码是:

var y = d3.scale.ordinal()
    .domain(taskTypes)
    .rangeRoundBands([ 0, height - margin.top - margin.bottom ], .1);

它只显示y轴上的唯一值,我想按原样显示值。你能帮我解决正确的代码吗?

1 个答案:

答案 0 :(得分:1)

This answer给出了基本解决方案:使用序数比例,域值唯一地标识相应的范围值。在您的情况下,'“slot1”'输入值将映射到相同的输出值,因此不会显示为唯一。

解决方案是使用数组索引(0, 1, 2...)而不是数组值("slot1", "slot2"...)作为序数比例输入域:

var taskTypes = ["slot1", "slot2", "slot3","slot4","slot1","slot2","slot6"];

var y = d3.scale.ordinal()
     .domain(d3.range(0, taskTypes.length))
     .rangeRoundBands([ 0, height - margin.top - margin.bottom ], .1);

在这里小提琴:http://jsfiddle.net/henbox/fhf3095r/3/