D3 V5：将初始缩放与缩放事件同步

Question

我正在尝试在我的网络上设置初始缩放。 它工作正常，但只要我尝试手动缩放图表，可视化就会跳转到它的自然缩放设置。 阅读 Stack 上的答案和 d3 的官方文档，以下代码对我来说是正确的，但它并没有解决问题。

我究竟做错了什么？ 非常感谢您的帮助！

const svg = d3.select('div#network')
    .append("svg")
        .attr("width", width + margin.left + margin.right)
        .attr("height", height + margin.top + margin.bottom)
        .call(d3.zoom().on("zoom", function () {
            svg.attr("transform", d3.event.transform)
        }),d3.zoomIdentity.scale(.2))
    .append("g")
        .attr("transform", `translate(${margin.left},${margin.top})`)
        .attr("transform","scale(.2)")

Answer 1

解决了。 我几乎是对的！ 您需要进行第二次“调用”，而不是将此转换作为第一个转换的参数。

const svg = d3.select('div#reseau')
    .append("svg")
        .attr("width", width + margin.left + margin.right)
        .attr("height", height + margin.top + margin.bottom)
        .call(d3.zoom().on("zoom", function () {
            svg.attr("transform", d3.event.transform)
        }))
        .call(d3.zoom().transform,d3.zoomIdentity.scale(.2))
    .append("g")
        .attr("transform", `translate(${margin.left},${margin.top})`)
        .attr("transform","scale(.2)")