D3 中带标签的线性刻度

Question

在 D3 中是否可以使用线性刻度但使用（序数样式）标签？

我想在 X 轴下显示月份名称。一开始我用的是序号，效果很好；但事实证明 D3 缩放不适用于顺序缩放。

所以我想要线性刻度（0-11 作为月份数字）但是当我们渲染轴时以某种方式获得月份名称。那可能吗？任何 suggestions/workarounds 都表示赞赏。

Answer 1

实现了这个

例如，

var y = d3.scale.linear()
.range([height, 0]);

var yAxis = d3.svg.axis()
.scale(y)
.orient("left")
.ticks(5)
.tickFormat(function (d) {
    switch(d) {
        case 40: return "Monday"; break;
        case 50: return "Tuesday"; break;
        case 60: return "Wednesday"; break;
        case 70: return "Thursday"; break;
        case 80: return "Friday"; break;
    }
});

Answer 2

应该像下面这样工作，但您需要相应地映射您的 'data'。

var data = [40,50,60,70,80]
var days = ["Mon","Tue","Wed","Thu","Fri"]

var yAxis = d3.svg.axis()
.scale(y)
.orient("left")
.ticks(5)
.tickFormat(function (d,i) {
    return days[i];
});

D3 中带标签的线性刻度

Linear scale with labels in D3

data-visualization

graph-visualization

d3.js