d3里zoom缩放时力导向图会偏移，怎么让图以鼠标光标为中心进行缩放？

Question

在写一个d3的力导向图，用到zoom进行缩放，现在可以缩放，但是缩放时整个图会偏移，要怎么禁止这种偏移？
我想要的效果是，缩放的时候是以鼠标光标为中心进行的。

// 缩放
function onZoomStart() {
  console.log('start zoom');
}
function zooming(d) {
  console.log('zoom ing', d3.event.transform.k, d3.event.type, d3.zoomTransform(this));
  d3.select(this).attr('transform', d3.zoomTransform(this));
}
function onZoomEnd() {
  console.log('zoom end');
}
const zoom = d3.zoom()
  .translateExtent([[0, 0], [WIDTH, HEIGHT]])
  .scaleExtent([1 / 10, 10]) // 设置最大缩放比例
  .on('start', onZoomStart)
  .on('zoom', zooming)
  .on('end', onZoomEnd);

// 定义svg和g，其他内容放在g里面
const svg = d3.select('svg').append('svg')
  .attr('width', WIDTH)
  .attr('height', HEIGHT);
const g = svg.append('g').attr('class', 'force_g')
  .attr('width', WIDTH)
  .attr('height', HEIGHT)
  .call(zoom);

Answer 1

已解决。
参考：http://blockbuilder.org/mbost...