解决D3.zoom()缩放和平移初始化时图形位置会跳跃的问题(v6版本)

先奉上有问题的代码

 //在页面中添加svg 支持拖拽和缩放
  var svg = d3.select("#body").append("svg").attr("width", 1000).attr("height", 1000)
    .call(d3.zoom().scaleExtent([1, 3]).on("zoom",
      function redraw(event: any) {
        svg.attr("transform", event.transform);
      }
    )).append("g").attr("transform", "translate(" + 350 + "," + 20 + ")")

解决方案 ：在后面添加 .append(“g”),缩放的时候重新绘制

var svg = d3.select("#body").append("svg").attr("width", 1000).attr("height", 1000)
    .call(d3.zoom().scaleExtent([1, 3]).on("zoom",
      function redraw(event: any) {
        svg.attr("transform", event.transform);
      }
    )).append("g").attr("transform", "translate(" + 350 + "," + 20 + ")").append("g");

在老版本中是通过zomm.translate([350,20])解决上述问题的
D3实现组织型tree结构的完整代码 https://blog.csdn.net/qq_44621394/article/details/119392957
包含拖拽、缩放、平移、折叠、异步加载节点自定义渲染等功能