The google API doesn't like being loaded inside other functions. Try this
instead:
google.load('visualization', '1.0', {'packages':['corechart']});
google.setOnLoadCallback(drawChart);
function drawChart() {
$.getJSON('/data/thedata.json', function(data){
console.log(data);
var data = new google.visualization.DataTable();
data.addColumn('string', 'Country');
data.addColumn('number', 'Node Count');
data.addRows(data);
var options = {
title: 'Tor Nodes by Country',
width: 800,
height: 600
};
var chart = new
google.visualization.PieChart(document.getElementById('nodes'));
chart.draw(data, options);
});
}
On Tuesday, May 14, 2013 5:28:50 AM UTC-4, Timothy Makobu wrote:
>
> The data /data/thedata.json returns is "[[\"Canada\", 66], [\"Turkey\",
> 10], [\"Hungary\", 23], [\"Italy\", 49]]"
>
> Whats the best way to feed it to data.addRows();
>
>
> On Tue, May 14, 2013 at 10:36 AM, Timothy Makobu
> <[email protected]<javascript:>
> > wrote:
>
>> It seems its when I mix this code with jquery that it stops working. I
>> was using $.getJSON to get "data" as in the code below:
>>
>> $(document).load(
>> $.getJSON('/data/thedata.json', function(data){
>> console.log(data)
>> google.load('visualization', '1.0', {'packages':['corechart']});
>> google.setOnLoadCallback(drawChart);
>> function drawChart() {
>> var data = new google.visualization.DataTable();
>> data.addColumn('string', 'Country');
>> data.addColumn('number', 'Node Count');
>> data.addRows(data);
>> var options = {'title':'Tor Nodes by Country',
>> 'width':800,
>> 'height':600};
>> var chart = new
>> google.visualization.PieChart(document.getElementById('nodes'));
>> chart.draw(data, options);
>> }
>> }
>> )
>> )
>>
>>
>> withouth the jquery, and a hard coded list fed to data.addRows, it runs
>> fine. Is there a google js api alternative to $.getJSON? Or how can I make
>> the above work?
>>
>>
>>
>>
>> On Mon, May 13, 2013 at 4:30 PM, asgallant
>> <[email protected]<javascript:>
>> > wrote:
>>
>>> Post the full HTML that you are using and I will take a look.
>>>
>>>
>>> On Monday, May 13, 2013 9:11:58 AM UTC-4, Timothy Makobu wrote:
>>>
>>>> Hi,
>>>>
>>>> The div with that id is definitely there.
>>>> On May 13, 2013 3:12 PM, "Daniel LaLiberte" <[email protected]>
>>>> wrote:
>>>>
>>>>> Timothy,
>>>>>
>>>>> You need an element in your page with id="'slices_of_pie" to serve as
>>>>> the container of the pie chart. The error message sounds like it is
>>>>> saying
>>>>> this element is missing.
>>>>>
>>>>> dan
>>>>>
>>>>>
>>>>> On Mon, May 13, 2013 at 3:21 AM, Timothy Makobu <[email protected]
>>>>> > wrote:
>>>>>
>>>>>> Hello all,
>>>>>>
>>>>>> I'm getting started with GCT. The pie chart on the quickstart wont
>>>>>> render though. Below is the error:
>>>>>>
>>>>>> Timestamp: 5/13/2013 10:16:15 AM
>>>>>> Error: Error: Container is not defined
>>>>>> Source File: https://www.google.com/uds/**api/visualization/1.0/**
>>>>>> 0fb98c40e9e7bc594107c5bf2cc32e**1e/format+en_GB,default,**
>>>>>> corechart.I.js<https://www.google.com/uds/api/visualization/1.0/0fb98c40e9e7bc594107c5bf2cc32e1e/format+en_GB,default,corechart.I.js>
>>>>>> Line: 850
>>>>>>
>>>>>> And here's my code:
>>>>>> <script type="text/javascript">
>>>>>> google.load('visualization', '1.0', {'packages':['corechart']});
>>>>>>
>>>>>> function drawChart(){
>>>>>> var data = new google.visualization.**DataTable();
>>>>>> data.addColumn('string', 'Topping');
>>>>>> data.addColumn('number', 'Slices');
>>>>>> data.addRows([
>>>>>> ['Mushrooms', 3],
>>>>>> ['Onions', 1],
>>>>>> ['Olives', 1],
>>>>>> ['Zucchini', 1],
>>>>>> ['Pepperoni', 2]
>>>>>> ]);
>>>>>>
>>>>>> var options = {
>>>>>> 'title':'How much pizza I ate last night',
>>>>>> 'width':400,
>>>>>> 'height':300,
>>>>>> }
>>>>>>
>>>>>> var chart = new google.visualization.PieChart(**
>>>>>> document.getElementById('**slices_of_pie'));
>>>>>> chart.draw(data, options);
>>>>>> }
>>>>>> google.setOnLoadCallback(**drawChart);
>>>>>>
>>>>>>
>>>>>> </script>
>>>>>>
>>>>>> What I'm I doing wrong?
>>>>>>
>>>>>> --
>>>>>> You received this message because you are subscribed to the Google
>>>>>> Groups "Google Visualization API" group.
>>>>>> To unsubscribe from this group and stop receiving emails from it,
>>>>>> send an email to google-visualization-api+**
>>>>>> [email protected].
>>>>>> To post to this group, send email to google-visua...@**
>>>>>> googlegroups.com.
>>>>>>
>>>>>> Visit this group at http://groups.google.com/**
>>>>>> group/google-visualization-**api?hl=en<http://groups.google.com/group/google-visualization-api?hl=en>
>>>>>> .
>>>>>> For more options, visit
>>>>>> https://groups.google.com/**groups/opt_out<https://groups.google.com/groups/opt_out>
>>>>>> .
>>>>>>
>>>>>>
>>>>>>
>>>>>
>>>>>
>>>>>
>>>>> --
>>>>> Daniel LaLiberte<https://plus.google.com/100631381223468223275?prsrc=2>
>>>>> - 978-394-1058
>>>>> [email protected] 562D 5CC, Cambridge MA
>>>>> [email protected] 9 Juniper Ridge Road, Acton MA
>>>>>
>>>>> --
>>>>> You received this message because you are subscribed to a topic in the
>>>>> Google Groups "Google Visualization API" group.
>>>>> To unsubscribe from this topic, visit https://groups.google.com/d/**
>>>>> topic/google-visualization-**api/1I1x9iP8PFU/unsubscribe?**hl=en<https://groups.google.com/d/topic/google-visualization-api/1I1x9iP8PFU/unsubscribe?hl=en>
>>>>> .
>>>>> To unsubscribe from this group and all its topics, send an email to
>>>>> google-visualization-api+**[email protected].
>>>>> To post to this group, send email to google-visua...@**
>>>>> googlegroups.com.
>>>>>
>>>>> Visit this group at http://groups.google.com/**
>>>>> group/google-visualization-**api?hl=en<http://groups.google.com/group/google-visualization-api?hl=en>
>>>>> .
>>>>> For more options, visit
>>>>> https://groups.google.com/**groups/opt_out<https://groups.google.com/groups/opt_out>
>>>>> .
>>>>>
>>>>>
>>>>>
>>>> --
>>> You received this message because you are subscribed to a topic in the
>>> Google Groups "Google Visualization API" group.
>>> To unsubscribe from this topic, visit
>>> https://groups.google.com/d/topic/google-visualization-api/1I1x9iP8PFU/unsubscribe?hl=en
>>> .
>>> To unsubscribe from this group and all its topics, send an email to
>>> [email protected] <javascript:>.
>>> To post to this group, send email to
>>> [email protected]<javascript:>
>>> .
>>> Visit this group at
>>> http://groups.google.com/group/google-visualization-api?hl=en.
>>> For more options, visit https://groups.google.com/groups/opt_out.
>>>
>>>
>>>
>>
>>
>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at
http://groups.google.com/group/google-visualization-api?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
