d3.zoom()拖动时抖动

用tree布局绘制了一个树图,但是在拖动时出现了抖动问题。
老代码:

    this.svg.call(
         d3.zoom()
        .scaleExtent([0.1, 3])
        .on('zoom', () => {
          this.svg.attr('transform', d3.event.transform);
        })
    );

google之后找到了问题的原因和解决方案,可参考下面2篇文章:
drag-zoom-smoother
understanding zoom behavior bindings

新代码:

    this.g = this.svg.append('g');
    this.svg.call(
      d3.zoom()
        .scaleExtent([0.1, 3])
        .on('zoom', () => {
          this.g.attr('transform', d3.event.transform);
        })
    );
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容