D3.js不同的图表区域转换

d3.js difference chart area transitions

本文关键字：区域 转换 js D3      更新时间：2023-09-26

我在让差异图的区域部分正确执行转换时遇到了麻烦。

我还在学习，这个图表是基于Mike Bostock的差异图示例，过渡是由d3noob的过渡帖子指导的。

相关:

  svgchin.select("#clip-above-chin path")
    .duration(750)
    .attr("d", area.y0(0));
  svgchin.select("#clip-below-chin path")
    .duration(750)
    .attr("d", area.y0(height));
  svgchin.select(".area.above")
    .duration(750)
    .attr("d", area.y0(function(d) { return y(d["Post"]); }));
  svgchin.select(".area.below")
    .duration(750)
    .attr("d", area);

完整的jsFiddle在这里:http://jsfiddle.net/uxb3yq9g/6/

可以看到，线和轴按预期更新。然而，这些地区还没有加入进来。

任何想法?

实际上还没有更新绑定到元素的数据。只做

var svgchin = d3.select("#chinook").datum(data).transition();

，一切正常。完整的演示在这里。

相关文章：