如何在不重画每帧的情况下更新d3可视化

我使用d3来创建波形可视化。我让它看起来很棒，但在我努力设计这个波形时，我没有注意到以一种优化的方式做它;我只是想让它起作用。

setInterval(function() {
  if (refresh) waveform();
  if (palette_refresh) {
    palette_refresh = false;
    updateColorPalette();
  }
}, options.refresh_rate);
function waveform() {
  analyser.getByteFrequencyData(fd);
  document.getElementById('wf_box').innerHTML = "";
  var data = ... irrelevant implementation details ...
  var chart = d3.select("#wf_box").append("svg")
    .attr("class", "chart")
    .attr("width", "" + percent_offset + "%")
    .attr("style", "padding-left:" + (100 - percent_offset) + "%;")
    .attr("viewBox", "0 0 " + Math.max(w * data.length, 0) + " " + Math.max(h, 0));
  chart.selectAll("rect")
    .data(data)
    .enter().append("rect")
    .attr("x", function(d, i) {
      var x_offset = x(i) - Math.max(w * max / 900 - 0.25, 0.1) / 2;
      return x_offset;
    })
    .attr("y", function(d, i) {
      var height = y(d * options.bar_height) / h;
      return h - Math.pow(Math.max(height, 0.01), 1.5);
    })
    .attr("width", function(d) {
      return '1px';
    })
    .attr("height", function(d, i) {
      var height = y(d * options.bar_height) / h;
      return Math.pow(Math.max(height, 0.01), 1.5) + options.bar_y_offset;
    });
}

正如您所看到的，我使用选项反复调用波形函数。Refresh_rate作为我的速度。我想有一种更有效的方法来更新波形中使用的数据，而不是从DOM中删除波形并每帧重新绘制它。有人知道我该怎么做吗?

谢谢!