Question

我正在堆积区域图表上的brushed（）/ zoom（）函数中苦苦挣扎。

尽管完美绘制了第一代图表，但只要调用了brush（）或zoom（），SVG路径就会出现损坏/收集一些NaN，从而导致某些区域消失。

问题出在brushed（）或zoom（）函数的for循环中，我称之为这种行：

focus.select(".area."+customString[i]).attr("d", window['d3_AreaVariable_'+i]]);

之前绘制的图表很好，但是一旦我在brushed（）函数中执行这些选择，attr（＆＃34; d＆＃34;）会在SVG路径中返回一些NaN（在控制台上，attr（＆＃34; d＆＃34;）在刷过（）之前选择返回没有NaN的正确值。

有趣的是，一些区域（第一个和最后一个区域）没有被破坏并且保持可缩放和可刷新（因此它应该适用于所有人！？）但是许多其他区域因腐败而消失。

也许在窗口对象中存储这些d3.area（）变量不是一个好习惯吗？

不确定我遗漏了什么，但有任何线索/提示可能导致什么原因？

这是我的brushed（）函数。感谢。

function brushed() {

  if (d3.event.sourceEvent && d3.event.sourceEvent.type === "zoom") return;
  s = d3.event.selection || x2.range();
  x.domain(s.map(x2.invert, x2));

  for(var i = 0; i < someArrayOfStrings.length; i++)
  { // problem here
    focus.select(".area."+someArrayOfStrings[i]).attr("d", window[someArrayOfStrings[i]]); 
  }

  focus.select(".axis--x").call(xAxis);
  focus.select(".axis--xY").call(xAxisYear);
  svg.select(".zoom").call(zoom.transform, d3.zoomIdentity
      .scale(width / (s[1] - s[0]))
      .translate(-s[0], 0));
}

D3.js刷子和缩放上的SVG路径损坏（堆积区域图表）

0 个答案: