d3.jspie-chartscatter-plotinformation-visualization

How to change the location of the pie chart in D3?

Now I am trying to build pie charts which can be placed anywhere on the canvas in D3.

However in D3, the pie chart is composed like "[g class="arc][path][/g]",

but neither of "g tag" or "path tag"'s location can be changed.

Is there any solution to change the location of the pie chart on the canvas.

Thank you so much in advance!

Solution

  • You can change the position of an svg object (like a group) element with translate.

    For example:

    <g transform="translate(20,20)"></g>

    Check a live example here: http://jsbin.com/zajij/1/

    In d3 you can add an attr to add this transform

    .attr("transform", "translate(20,20)");

    Hope this helps!