Javascript d3作用域导致SVG恢复为初始数据？

我是d3.js新手，一般来说还是javascript初学者。我已经让d3基于数组中的单个值正确地绘制了单个SVG矩形。当我通过一个输入字段增加区域中数字的值，然后调用reDraw函数时，矩形将更改为新的大小一秒钟，然后切换回初始大小。我想我一定有个范围界定的问题，但我想不出来。有什么想法吗

var dataset, h, reDraw, svg, w;

w = 300;

h = 400;

dataset = [1000];

// Create SVG element
svg = d3.select("#left").append("svg").attr("width", w).attr("height", h);

// set size and position of bar
svg.selectAll("rect").data(dataset).enter().append("rect").attr("x", 120).attr("y", function(d) {
  return h - (d / 26) - 2;
}).attr("width", 60).attr("height", function(d) {
  return d / 26;
}).attr("fill", "rgb(3, 100, 0)");

// set size and position of text on bar
svg.selectAll("text").data(dataset).enter().append("text").text(function(d) {
  return "$" + d;
}).attr("text-anchor", "middle").attr("x", 150).attr("y", function(d) {
  return h - (d / 26) + 14;
}).attr("font-family", "sans-serif").attr("font-size", "12px").attr("fill", "white");

// grab the value from the input, add to existing value of dataset
$("#submitbtn").click(function() {
  localStorage.setItem("donationTotal", Number(localStorage.getItem("donationTotal")) + Number($("#donation").val()));
  dataset.shift();
  dataset.push(localStorage.getItem("donationTotal"));
  return reDraw();
});

// redraw the rectangle to new size
reDraw = function() {
  return svg.selectAll("rect").data(dataset).attr("y", function(d) {
    return h - (d / 26) - 2;
  }).attr("height", function(d) {
    return d / 26;
  });
};

您需要告诉d3如何在

reDraw

函数中将新数据与现有数据进行匹配。也就是说，您在

重画中选择所有矩形，然后将数据绑定到它，而不告诉它新旧之间的关系。因此，在调用
data（）
之后，当前选择（您正在操作的选择）应该为空（根本不知道为什么会发生某些事情），而
enter（）
选择包含新数据，而
exit（）
选择包含旧数据

您有几个选项来实现这一点。您可以在当前设置中操作
enter（）
和
exit（）
选项，即删除旧的并添加新的，或者重新构造数据，以便能够匹配旧的和新的。例如，可以使用具有适当属性的对象，而不是单个数字。后者的优点是可以添加从旧尺寸到新尺寸的过渡

有关数据联接的更多信息，请参阅

编辑：

事实证明，这实际上不是问题所在，请参阅注释。
我正试图复制Mike Bostock教程中的一部分，其中重新绘制时不需要enter（）和exit（）：以下是相关说明：“不需要进入和退出选择！如果没有数据联接，数据将通过索引联接到节点。由于数据数组的长度是固定的，因此节点的数量永远不会改变，因此输入和退出选择始终为空。“但我无法在非常基本的设置中使用它：啊，好吧，让完整的示例得到帮助：）当您单击“提交”按钮时，页面将刷新，从而显示原始值。简单地
返回false位于处理程序函数的末尾，页面将不会刷新。最好从
localStorage
获取当前值，而不是硬编码。宾果！还有，嗯。嘘，真不敢相信我忘了。我忘了为什么我决定硬编码它。与测试有关。但是当我按照你建议的方式修改它时，我根本不需要重画函数。D3立即更新我的酒吧。我的客户可以进入此页面更新温度计：他的访客可以进入此页面查看温度计以及随附的照片和文字：非常感谢Lars！当然，现在我必须弄清楚如何在没有本地存储的情况下更新它。这仅适用于正在进行更新的浏览器和用户。任何其他进入该页面的人都不会拥有该数据。是的，唯一的方法是将该值存储在服务器上的数据库或类似的东西中。