How do you animated pie chart with text labels?

[Jake Wilson]

I understand how to update and animate a pie chart after giving it new data.  However I'm trying to add text labels to the chart, but now I can't get it to animate anymore.  I think it's something to do with the extra 'g' elements that are added to the SVG.

Here is a jsfiddle:  http://jsfiddle.net/H2SKt/234/

Can anyone help me out with this?

1. How do you get the chart to update (see the update() function)?

2. Can I animate this change using transition() and attrTween() just like usual?

[Frank Guerino]

Hi Jake,

Here are two examples of Animated Pie Charts.  Both also show how to integrate the D3 Pie Chart with a real HTML web page.

- Animated Pie Chart

- Radial Wheel (a more complex Animated Pie Chart)

I hope you find them useful.

Frank

--

Frank Guerino

Chairman

The International Foundation for Information Technology (IF4IT)

--
You received this message because you are subscribed to the Google Groups "d3-js" group.
To unsubscribe from this group and stop receiving emails from it, send an email to d3-js+un...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[Jake Wilson]

Thanks for the suggestions.  But specifically I'm trying to figure out how to animate the pie slices AND the text positions when I change the data values.  Like if one of the slice values goes down, I need to the pie slice to decrease in size, and I need the text label to automatically adjust it's position as well.

Is it possible?

--
You received this message because you are subscribed to a topic in the Google Groups "d3-js" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/d3-js/WFrsx1hVtpc/unsubscribe?hl=en.
To unsubscribe from this group and all its topics, send an email to d3-js+un...@googlegroups.com.

[Frank Guerino]

Hi,

I haven't seen a working example of transitioning Pie Arcs, yet.  If you find one, please post a link to it, as I'd love to learn how to do it, too.

Thanks,

Frank

--

Frank Guerino

Chairman

The International Foundation for Information Technology (IF4IT)

[Jake Wilson]

Here's one here:

http://bl.ocks.org/mbostock/1346410

It works very well once you understand how to do it.

The problem I'm having though, is adding in text labels to the pie slices, and then animating the position of those as well.  It's something to do with the extra 'g' elements that you add into the svg that the slices become children of that confuses me.