使用d3將其平移到另一個位置

Question

我想將svg從（0,0）（初始位置）轉換為位置say（500,50）。 為此，我正在使用下面的代碼，但它不起作用。請給我一些想法。

var svg = d3.select("body")
        .append("svg:svg")
        .attr("width", 600)
        .attr("height", 600)
        .append("g")
        .attr("transform","translate(500,50)");

Answer 1

您的代碼正在g元素上設置了transform屬性。 因此，g元素將在svg元素內轉換。 如果打算翻譯svg元素，請使用所需的轉換在svg元素上設置style屬性。 切記在平移距離上包括單位。 例如...

var svg = d3.select("body")
.append("svg:svg")
.attr("width", 600)
.attr("height", 600)
.attr("style", "transform: translate(500px,50px)")
.append("g")