D3:多系列图表不适用于上一版本

D3: Multi-Series chart not working with last version

本文关键字:适用于 版本 不适用 系列 D3      更新时间:2023-09-26

我试图创建一个多系列折线图,我发现了这个有用的例子http://bl.ocks.org/bobmonteverde/2070069.

问题是,它适用于前一版本的d3(版本2),也适用于上一版本(版本3)的一些问题。经过调试,我发现D3的转换函数在尝试执行transition = node[ns][id0]时出错,并且node[ns]未定义。我有这个正在工作的小提琴http://jsfiddle.net/jupa_aguilar/0L1pyw8u/.我还观察到,对于d3.v2.js,d3_selectionPrototype.transition是:

d3_selectionPrototype.transition = function() {
var subgroups = [], subgroup, node;
for (var j = -1, m = this.length; ++j < m; ) {
  subgroups.push(subgroup = []);
  for (var group = this[j], i = -1, n = group.length; ++i < n; ) {
    subgroup.push((node = group[i]) ? {
      node: node,
      delay: d3_transitionDelay,
      duration: d3_transitionDuration
    } : null);
  }
}
return d3_transition(subgroups, d3_transitionId || ++d3_transitionNextId, Date.now());};

对于d3.v3.js:

d3_transitionPrototype.transition = function() {
var id0 = this.id, id1 = ++d3_transitionId, ns = this.namespace, subgroups = [], subgroup, group, node, transition;
for (var j = 0, m = this.length; j < m; j++) {
  subgroups.push(subgroup = []);
  for (var group = this[j], i = 0, n = group.length; i < n; i++) {
    if (node = group[i]) {
      transition = node[ns][id0];
      d3_transitionNode(node, i, ns, id1, {
        time: transition.time,
        ease: transition.ease,
        delay: transition.delay + transition.duration,
        duration: transition.duration
      });
    }
    subgroup.push(node);
  }
}
return d3_transition(subgroups, ns, id1);};

对此有什么想法吗?

最好使用D3最新版本启动代码。D3的最新版本与上一个版本相比有一些变化。

所以,请从互联网上用你的舒适版本来检查这个例子,并尝试实现它,而不是自己将旧版本的图表转换为新版本。

如果您想查看示例,请访问D3 V3 的多系列折线图