Question

几天后我遇到了问题。我有一个图表，当我使用Zoom Behavior时，它可以工作，但我需要知道何时达到最大缩放以加载新的

// Specifies the zoom scale's allowed range, [min, max]
d3.behavior.zoom().x(x).scaleExtent([1,10]).on("zoom", draw)

查看我的代码 http://jsfiddle.net/albanlopez/D4MRP/

Answer 1

在绘图功能中，当前事件将具有缩放级别（如您所述，为d3.event.scale）。此外，如果你保持行为像：

var zm = d3.behavior.zoom().x(x).scaleExtent([1,10]).on("zoom", draw);

然后您可以通过调用

找到当前的缩放级别

zm.scale();

Answer 2

从D3 v4开始，有两种记录的检索缩放状态的方法。引用d3 / d3-zoom自述文件（在缩放变换下）：

要检索缩放状态，请在当前缩放上使用event.transform 缩放事件侦听器中的事件（请参阅zoom.on）或使用给定节点的d3.zoomTransform。

https://github.com/d3/d3-zoom/blob/master/README.md#zoom-transforms

Answer 3

rect.call(zm=d3.behavior.zoom().x(x).scaleExtent([1,10]).on("zoom", draw));

经过新的测试我得到了答案：

var currentZoom = d3.event.scale;

但仅在 .on（“缩放”，“绘制”）调用的 draw（）函数中可用/可读

rect.call( zm = d3.behavior.zoom().x(x).scaleExtent([1,10]).on("zoom", draw));

function draw() {
    // trace l'axe X
    svg.select("g.x.axis").call(xAxis);
    // trace l'axe Y
    svg.select("g.y.axis").call(yAxis);
    // trace la courbe
    svg.select("path.line").attr("d", line);

    console.log(zm.scale(), zm.translate()); // , zm.translate[1] = Y
    console.log(d3.event.scale, d3.event.translate[0]); // , d3.event.translate[1] = Y
}

Answer 4

截至今天（d3.v5），检查闭包内缩放级别的方法是查看此属性：

<块引用>

d3.event.transform.k

如何知道D3.js中的当前缩放级别

4 个答案: