小编erw*_*lim的帖子

我想创建以下内容：

1. 制作动态图

2. 它是可缩放的（在当前显示的中心缩放）（单击某些按钮时缩放，禁用鼠标滚轮缩放）

3. 元素是可拖动的（拖动时不受力图排列的影响）（当元素被拖动到 svg 之外时，svg 的大小会增加）

4. 它具有用作平移的滚动条

到目前为止，我已经成功了

1. 创建力图
2. 创建缩放
3. 元素已经可拖动，拖动后不生效
4. 滚动条也

我对这些组合项目有两个问题：

1. 拖动元素后，它不再包含在力图中。如果是新元素，这将导致其他元素可能重叠。
2. 带有缩放功能的滚动条不会产生奇迹，当您缩放->滚动->缩放时，它会在第一次缩放发生的旧位置进行缩放。

我真的需要帮助解决这两个问题。我还没有看到任何缩放和滚动条组合的示例。

这是代码。

function drawGraph(Data){
setDefault();

svg = d3.select("#graphingArea").append("svg")
  .attr("width", width + margin.left + margin.right)
  .attr("height", height + margin.top + margin.bottom)
  .call(zoom)
  .on("dblclick.zoom", false)
  .on("mousewheel.zoom", false)
  .on("DOMMouseScroll.zoom", false) // disables older versions of Firefox
  .on("wheel.zoom", false); // disables newer versions of Firefox;

//Needed for canvas to be dragged
rect = svg.append("rect")
  .attr("width", width)
  .attr("height", height)
  .style("fill", "none")
  .style("pointer-events", "all");

//Holds all that is to be …