【问题标题】:D3 - issues on first transition after initializationD3 - 初始化后第一次转换的问题
【发布时间】:2012-07-31 10:50:13
【问题描述】:

我创建了这个 jsbin http://jsbin.com/ibewux/3/edit 来显示转换时的奇怪行为。

图表初始化后,正确显示数据(见下表)。

如果我尝试通过下拉菜单更改图表类型,则会交换一些系列;发生这种情况后,系列不再交换。

如果你点击 updateChartData 按钮也会发生同样的事情;第一次它将与表中显示的数据相比交换系列。

所以似乎只有初始化后的第一次转换会受到这种不需要的交换的影响。

这是一小段代码,想知道您是否能找出发生这种情况的原因。

谢谢

【问题讨论】:

    标签: javascript d3.js


    【解决方案1】:

    isVerticalChart 为真时,您正在使用域svg.pointsNames 的序数刻度(这似乎是"Col " + i 形式的字符串数组):

    x = d3.scale.ordinal().domain(svg.pointsNames);
    

    但是,您随后继续使用具有此比例的基准索引,而不是这些字符串:

    .attr("x", function(d, i) { return isVerticalChart ? x(i) : x(d.y0 - d.size); })
    

    我认为您应该将一个字符串从域传递到此处的比例,以避免您看到的奇怪行为。

    目前它仅有效,因为如果您将密钥传递给以前从未见过的序数比例,它会将其添加到域中。

    可能还有其他问题,但希望这能让您更接近。

    【讨论】:

    • 感谢 Jason,这似乎解决了这个问题。如何用文本值(即 Col 1、Col 2 等)替换数字 x 刻度(即 0、1、2、3 等)?谢谢
    • 对于轴?这应该在您设置 axis.scale(x) 时自动发生(它将使用比例域作为序数比例)。您还可以使用axis.tickFormat 设置自定义tickFormat。如果您有特定问题,您应该打开一个新问题。理想情况下,使用更短的示例代码。 :)
    • 谢谢。我故意将所有代码留在那里,希望对其他人有用。学习到教训了。 :-)
    猜你喜欢
    • 1970-01-01
    • 2014-06-07
    • 2017-06-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-03-12
    • 2019-12-10
    • 1970-01-01
    相关资源
    最近更新 更多