D3 中带有标签的线性刻度答案

【问题标题】：Linear scale with labels in D3D3 中带有标签的线性刻度
【发布时间】：2016-06-09 23:44:36
【问题描述】：

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

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

所以我想要线性刻度（0-11 作为月份数字），但在渲染轴时以某种方式获取月份名称。那可能吗？任何建议/解决方法表示赞赏。

【问题讨论】：

标签： d3.js data-visualization graph-visualization

【解决方案1】：

应该像下面这样工作，但您需要相应地映射您的“数据”。

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

【讨论】：

【解决方案2】：

我使用 Axis.tickFormat 实现了这一点

例如，

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

【讨论】：

您可以为所有月份创建一个数组，并使用 function (d) { return arr[d]; } 在 tickformat() 中也是
感谢您的建议。绝对干净得多。
刚刚意识到，d不是指实际的tick值吗？例如。在上面的示例中，d 将采用值 40、50 等。那么我该如何使用 arr[d] 呢？我试过function (d, i)，但它给出了错误