d3树v5缩放/拖停

时间:2019-04-27 03:36:21

标签: javascript d3.js

我的d3 v5树在我的拖拽上结结巴巴。我发现一则帖子(D3 v5 Zoom Stutter)提到使整个SVG成为可拖动对象是一种可能的解决方案,并且正在努力了解如何实现。

  const zoom = d3.zoom()
    .extent([[margin.left, margin.top], [width, height]])
    .scaleExtent([1, 1])
    .on("zoom", zoomed);

  const svg = div.append('svg')
    .attr("width", width + margin.right + margin.left)
    .attr("height", height + margin.top + margin.bottom)
    .attr("viewBox", "0 "+(-1*(height-margin.top-margin.bottom)/2)+" "+width+" "+height)//required to re-position view based on nodeSize
    .append("g")
    .on('mousemove', function() {//debugging
        // console.log( d3.mouse(this) ) // log the mouse x,y position
    })
    .call(zoom)
    .attr("transform", "translate("+ margin.left + "," + margin.top + ")");

0 个答案:

没有答案