如何在D3中将变换原点设置到此矩形的中间？

// 假设矩形的宽度和高度分别为width和height
const width = 200;
const height = 100;

// 创建SVG容器
const svg = d3.select("body").append("svg")
    .attr("width", width + 20)
    .attr("height", height + 20);

// 创建矩形
const rect = svg.append("rect")
    .attr("x", 10)
    .attr("y", 10)
    .attr("width", width)
    .attr("height", height)
    .attr("fill", "blue");

// 计算矩形的中心点
const centerX = 10 + width / 2;
const centerY = 10 + height / 2;

// 将变换原点设置到矩形的中心点
rect.attr("transform", `translate(-${centerX}, -${centerY})`);