如何在svg而不是節點下放大svg語義圖

Question

我正在研究可摺疊樹形圖縮放。每當我想縮放我必須保持鼠標指針節點（圓圈），然後只有我能夠放大和縮小。但它應該能夠當鼠標在圖形中的任何位置。

變焦功能調用以下：

var svg = d3.select("body").append("svg") 
    .attr("width", width + margin.right + margin.left) 
    .attr("height", height + margin.top + margin.bottom) 
    .append("g") 
    .attr("transform", "translate(" + margin.left + "," + margin.top + ")") 
    .call(d3.behavior.zoom().x(x).y(y).scaleExtent([1,8]).on("zoom",zoom)); 

我下面這個例子鏈接，放大和縮小：http://jsfiddle.net/6kEpp/37/

任何幫助將非常感激。

Answer 1

只需將矩形添加到SVG即可。

svg.append('svg:rect') 
    .attr('width', width + margin.right + margin.left) 
    .attr('height', height + margin.top + margin.bottom) 
    .attr('fill', 'white');