将d3树状态保存到localStorage

Question

我使用d3.js创建了一个可折叠的树布局，用户可以在其中单击以展开和折叠分支。如果用户在展开某些分支后离开页面并稍后返回该页面，则该图表应处于与其离开时相同的状态。

现在，我有一个点击功能，可以将点击的节点标记为open或closed（或者如果尚未点击则未定义）：

function click(d) {
  if (d.children) {
    d._children = d.children;
    d.children = null;
  } else {
    d.children = d._children;
    d._children = null;
  }
  // toggle node state
  if (d.state === undefined || d.state == "closed") {
    d.state = "open";
  } else {
    d.state = "closed";
  }
  update(d);
}

这很好用，而且很简单。

我的想法是使用这些新信息更新我正在使用的JSON数据集，并将其写入localStorage，每次用户访问该页面时首先检查它，然后虚拟点击标记为“open”的所有节点（不知道如何做到这一点否则）。

但问题是，如何我用这个新的节点信息重写JSON数据集，还是有比上面概述的更好的方法？

请注意，实际来自localStorage的放入和取出不是问题;我知道该怎么做。它具体是如何将树的当前状态恢复为新的/修订的数据集，以后当用户返回页面时脚本可以再次读取。