javascript - 如何将像素转换为 d3 中的转换值？

Question

我有一个 g 元素，我试图通过将圆的 cx 和 cy 位置赋予 g 元素来将其放在我的圆元素的顶部。但是，这不起作用，因为 g 使用翻译。知道如何将像素转换为翻译吗？

colorPickerX = d3.select(dataPointId).attr("cx");
colorPickerY = d3.select(dataPointId).attr("cy");
var svg = d3.select("body")
    .append("svg")
    .attr("width", 300)
    .attr("height", 300)
    .append("g")
    .attr("transform", "translate("+colorPickerX+","+colorPickerX+")"); \\This is wrong because Cx and Cy are Pixels

Answer 1

使用 parseFloat 执行此操作:

//parseFloat will get the number and ignore the px in the end.
colorPickerX = parseFloat(d3.select(dataPointId).attr("cx"));
colorPickerY = parseFloat(d3.select(dataPointId).attr("cy"));

然后像上面那样使用它来翻译 g 组。