d3.js v4放大到图表中心（NOT MOUSE POSITION !!）

Question

我还有一个d3缩放问题。

我尝试缩放到图形的中心（忽略鼠标位置）。但是我没有找到任何对我有用的东西。

我试过this但我没有得到它的工作。

并没有在文档中找到任何东西。

缩放行为：

//zoom behavior 
let zoom = d3.zoom() 
    .scaleExtent([0.5, 5]) 
    .on("zoom", zoomed); 

function zoomed() { 
    .. some behavior .. 
    //center here? 
    .. some behavior .. 
} 

我想这应该是一件容易的事，不明白，为什么它没有明确记载的地方。

请参阅this fiddle整件事。

帮助将不胜感激

Answer 1

我设法解决我的问题。

查看this fiddle了解详情。

请注意，这也会禁用x平移。

这里的相关代码：

function getBoundingBoxCenterX (selection) { 
    let element = selection.node(); 
    let bbox = element.getBBox(); 
    return bbox.x + bbox.width/2; 
} 

//zoom behavior 
let zoom = d3.zoom() 
    .scaleExtent([1, 5]) 
    .on("zoom", zoomed); 

function zoomed() { 
    let center = getBoundingBoxCenterX(rect); //rect is the charts parent which expands while zooming 
    let chartsWidth = (2 * center) * d3.event.transform.k; 
    d3.event.transform.x = center - chartsWidth/2; 

    rescaling operations with d3.event.transform.... 
}