流圖可以縮放嗎？

Question

我在流圖上找到了一個示例，並且不知道此圖是否可以像折線圖一樣縮放 。 我還沒有找到“可縮放流圖”之類的示例。 那么在d3中有可能嗎？

Answer 1

蒸汽記錄儀中沒有什么特別的。 就像任何其他SVG圖表一樣，它是可縮放的。

例如，我正在使用Mike Bostock創建的這張蒸汽照片 ，只需添加以下內容：

svg.call(d3.zoom().on("zoom", function() {
        svg.attr("transform", d3.event.transform)
    }))
    .append("g");

結果如下： https : //bl.ocks.org/GerardoFurtado/raw/da06a5c751c442589ed9851ab3d823fc/bfd6883b30588bc76185614835409f5e1b40dc73/

或者，如果只想在x軸上縮放：

svg = svg.call(d3.zoom().on("zoom", function() {
    svg.attr("transform", "translate(" + d3.event.transform.x + ",0) scale(" + d3.event.transform.k + ",1)");
}))
.append("g");

結果是這樣的： https ： //bl.ocks.org/GerardoFurtado/raw/68eb354408724aafa77698640783b6f2/616094d7bee85ab33ca144518ce384e2064d4537/

這些都是簡單的演示，只是為了向您展示它的可能性。 但是，適當的解決方案包括更改x比例尺和剪切路徑，這需要更多工作。