I made up an example: http://jsfiddle.net/asgallant/ppPb4/ 

It might be a bit confusing to read, so if there's anything that doesn't 
make sense, feel free to ask.  Basically, I built a DataTable and grouped 
by column 0 to draw the first pie chart.  When users click the pie slices, 
I grab the selected slice and filter the DataTable based on it's column 0 
value to get the data for the second pie chart.

You can't animate the drawing of the chart, but there are tricks to achieve 
a similar effect, which may or may not work to your satisfaction.

On Friday, June 8, 2012 6:26:24 AM UTC-4, Rahim Haji wrote:
>
> Hi asgallant,
>
> ok so i am trying to do as per your suggestion but am stuck.
>
> can you show me how to load another pie chart when 1 is clicked. 
>
> we can use hard coded values for now... 
>
>
>
> On Thu, Jun 7, 2012 at 10:27 PM, Rahim Haji <
> [email protected]> wrote:
>
>> Ok, this looks good so far, would you be able to write this for me in a 
>> html page, i am willing to pay for your time, if that sweetens the deal for 
>> you ;-)
>>
>> also, upon clicking the segment i want to be able to load the new pie 
>> with animation... maybe growing from the centre out....
>>
>> On Thu, Jun 7, 2012 at 6:19 PM, asgallant <[email protected]>wrote:
>>
>>> Well, without knowing the specifics of the data structure, the basics 
>>> would look something like this:
>>>
>>> google.load('visualization', '1', {'packages': ['corechart']});
>>> google.setOnLoadCallback(drawCharts);
>>>
>>> function drawCharts() {
>>>     var data1 = new google.visualization.DataTable();
>>>     // populate data table
>>>     
>>>     var pie1 = new google.visualization.PieChart(document.getElementById
>>> ('pie_chart_1'));
>>>     var pie2 = new google.visualization.PieChart(document.getElementById
>>> ('pie_chart_2'));
>>>     
>>>     google.visualization.events.addListener(pie1, 'select', function () 
>>> {
>>>         var selection = pie1.getSelection();
>>>         // use selection to determine what you want to use for pie2
>>>         // create a DataView or DataTable for pie2
>>>         
>>>         pie2.draw(data2, {/* options for pie2 */});
>>>     });
>>>     
>>>     pie1.draw(data1, {/* options for pie1 */});
>>> }​​​​​​​​​​​​ 
>>>
>>> This can be extended to allow for multiple pie charts, going as many 
>>> layers deep as you like.
>>>
>>>
>>> On Thursday, June 7, 2012 11:18:34 AM UTC-4, Webtrendz wrote:
>>>>
>>>> Hi asgallant,
>>>>
>>>> i have the opportunity of creating the csv file for the data, so right 
>>>> now i have nothing but if you can help me link 4 pie charts where clicking 
>>>> a segment would load another pie chart, small in size so it sits within 
>>>> the 
>>>> size of original pie then i should be able to take it from there...
>>>>
>>>> i hope...
>>>>
>>>> On Thursday, 7 June 2012 15:53:53 UTC+1, asgallant wrote:
>>>>>
>>>>> You can certainly do that.  How you go about it largely depends on the 
>>>>> structure of the data.
>>>>>
>>>>> On Thursday, June 7, 2012 7:39:12 AM UTC-4, Webtrendz wrote:
>>>>>>
>>>>>> Hi all,
>>>>>>
>>>>>> I was wondering if anyone had managed to link multiple pie charts 
>>>>>> together. 
>>>>>>
>>>>>> e.g.
>>>>>>
>>>>>> pie A = work (10) school (5) nothing (5)
>>>>>>
>>>>>> if work is clicked then new pie should be added with following 
>>>>>> values: fulltime(10), parttime(5), flexi(3), self-employed(10).
>>>>>>
>>>>>> I would dearly like some help on this asap, failing that i am willing 
>>>>>> to pay someone to help me code a few more features together for 
>>>>>> interlinking pie/doughnut charts as well as getting data from external 
>>>>>> file.
>>>>>>
>>>>>> Regards,
>>>>>>
>>>>>> Rahim
>>>>>>
>>>>>  -- 
>>> You received this message because you are subscribed to the Google 
>>> Groups "Google Visualization API" group.
>>> To view this discussion on the web visit 
>>> https://groups.google.com/d/msg/google-visualization-api/-/jv-tcr9qOlkJ.
>>>
>>> To post to this group, send email to 
>>> [email protected].
>>> To unsubscribe from this group, send email to 
>>> [email protected].
>>> For more options, visit this group at 
>>> http://groups.google.com/group/google-visualization-api?hl=en.
>>>
>>
>>
>

-- 
You received this message because you are subscribed to the Google Groups 
"Google Visualization API" group.
To view this discussion on the web visit 
https://groups.google.com/d/msg/google-visualization-api/-/0FiL8wTe9msJ.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to 
[email protected].
For more options, visit this group at 
http://groups.google.com/group/google-visualization-api?hl=en.

Reply via email to