CODEWITHSUNDEEP
javascriptd3.jssvg
lokesh
lokesh

Reputation: 123

Translate it to another position using d3

I want to translate the svg from (0,0) (initial position) to position say(500,50). For this I am using the below code but it is not working.Please suggest me some idea.

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

Upvotes: 0

Views: 375

Answers (1)

Bobby Orndorff
Bobby Orndorff

Reputation: 3335

Your code is setting the transform attribute on the g element. Thus, the g element will be translated inside the svg element. If you intended to translate the svg element then set the style attribute on the svg element with the desired transform. Remember to include the units on the translate distances. For example...

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

Upvotes: 1

Related Questions