我无法缓存，因为我是用的grafana的html插件，在html插件中使用d3.js绘制力导图的，每次追加的时候都触发了重新加载页面，缓存不了

如果无法缓存当前树的状态，也可以尝试使用“增量绘制”的思路来避免页面抖动。

具体实现步骤如下：

1. 在页面初始化时，绘制力导图。

2. 当用户点击某个节点时，获取该节点的关系数据，并添加到当前树的状态中。

3. 根据新增的节点和边，利用D3.js的过渡（transition）效果，逐渐增量绘制力导图。这样就能避免页面抖动。

4. 当用户再次点击某个节点时，重复步骤2和3即可。

下面是示例代码：

// 点击节点时，添加关系数据并逐渐增量绘制力导图
function addNodeRelations(node) {
  // ...
  // 获取新增的节点和边
  // ...

  // 将新增的节点和边添加到当前树的状态中
  force.nodes().push(newNodes);
  force.links().push(newLinks);

  // 逐渐增量绘制力导图
  var nodeEnter = svg.selectAll(".node")
    .data(force.nodes())
    .enter().append("g")
    .attr("class", "node")
    .call(force.drag);

  // 绘制新增的节点
  nodeEnter.filter(function(d) { return newNodes.indexOf(d) >= 0; })
    .append("circle")
    .attr("r", 10)
    .style("fill", "red")
    .transition()
    .duration(1000)
    .style("fill", "steelblue");

  // 绘制新增的边
  svg.selectAll(".link")
    .data(force.links())
    .enter().append("line")
    .attr("class", "link")
    .style("stroke", "#ccc")
    .transition()
    .duration(1000)
    .style("stroke", "#999");
}

在实现过程中，你可能需要根据具体情况调整代码细节。