dc.js行图y轴无序

Question

我正在使用dc.js库设置一系列链接的可视化。除了一件小事之外，一切都很顺利。我正在使用行图来显示从1（最差）到10（最佳）的一系列用户评级，但是沿着行图的y轴排序是不正确的，如下图所示。

10评级直接显示在1评级之下，当它应该在y轴上的9评级之后显示。

以下是此图表的代码：

rowChart
    .width(450)
    .height(350)
    .dimension(ratingDim)
    .group(ratingGroup)
    .elasticX(true)
    .renderLabel(true)
    .xAxis().ticks(6)
    // The line below attempts to fix the scale issue, but when included
    // it breaks the visualizations, and nothing renders.
    .y(d3.scale.linear().domain([1, 10]));

当我包含.y(d3.scale.linear().domain([1,10]))代码时，控制台会抛出以下错误：TypeError: rowChart.width(...).height(...) ... .y is not a function。不知道该怎么做错误。感谢任何帮助 - 提前感谢阅读。

Answer 1

错误是因为行图不使用y比例。是的，很奇怪。

对于错误的排序，看起来你得到的是词典（字符串）排序而不是数字。你没有显示维度定义，但我猜你的csv或json解析器正在返回字符串，你需要将它们转换为数字。

执行此操作的简洁，惯用的方法是使用+：

var ratingDim = ndx.dimension(function(d) { return +d.rating; });