It seems there is something going on related to the way the server
returning the response. My server code (which is django) gets called
twice, once for foo and once for bar. I've run through it in pdb and
it gets all the way through both times, and definitely returns the
response. The server side returns that response using:
return
HttpResponse(data_table.ToResponse(columns_order=columns_order))
And it works perfectly if I only draw one of the tables (and it works
for either one). However, in the case where I try to draw both
tables, the call to handleQueryResponse never gets called for the
second. In other words, if I have:
function drawCharts() {
drawChartBar();
drawChartFoo();
}
handleQueryResponseBar() gets called but handleQueryResponseFoo() does
not. And if I reverse the order
function drawCharts() {
drawChartFoo();
drawChartBar();
}
then handleQueryResponseFoo() gets called, but
handleQueryResponseBar() does not. I've used firebug to debug this
and can clearly see that even though my server side returns two
responses, both handleQueryResponseFoo() and handleQueryResponseBar()
do not get called (and neither one gets called twice).
I've printed out the two responses returned by my server. I've cut my
data table down to just one row so that I can include the whole
response without it being horribly long. One thing I notice is that
both responses have reqId set to '0'. I'm not sure what reqId is, but
perhaps it is helping the returned data table get back to the correct
handler, and somehow things have gotten confused?
==> returning response for bar
google.visualization.Query.setResponse({'version':'0.6', 'reqId':'0',
'status':'OK', 'table': {cols:[{id:'date',label:'Date',type:'date'},
{id:'totOpen',label:'Open',type:'number'},
{id:'created',label:'Created',type:'number'},
{id:'cumCreated',label:'Tot Created',type:'number'}],rows:[{c:[{v:new
Date(2009,10,22)},{v:0},{v:0},{v:0}]}]}});
==> DONE
[11/Feb/2010 20:34:06] "GET /taskmanager/vis_datasource/?
tq=bar&tqx=reqId%3A0 HTTP/1.1" 200 337
==> returning response for foo
google.visualization.Query.setResponse({'version':'0.6', 'reqId':'0',
'status':'OK', 'table': {cols:[{id:'date',label:'Date',type:'date'},
{id:'totOpen',label:'Open',type:'number'},
{id:'created',label:'Created',type:'number'},
{id:'cumCreated',label:'Tot Created',type:'number'}],rows:[{c:[{v:new
Date(2009,8,15)},{v:0},{v:0},{v:0}]}]}});
==> DONE
[11/Feb/2010 20:34:06] "GET /taskmanager/vis_datasource/?
tq=foo&tqx=reqId%3A1 HTTP/1.1" 200 336
I definitely think the problem is deeper than just the client side
code. It sounds like folks are successful at printing two
annotatedtimelines when the data is set up on the client side. I think
there is some incorrect interaction going on here between the python
data table code and the way it is returning data to the client.
Carsten - are you from google? If not - is there anyone from Google
out there who could give me a hand and try out the case of returning
the responses from the python DataTable API? I really thing there is
a bug here ...
Margie
On Feb 11, 6:37 pm, Carsten Dressler <[email protected]>
wrote:
> I tried the following and it works:
>
> <!--
> copyright (c) 2009 Google inc.
>
> You are free to copy and use this sample.
> License can be found
> here:http://code.google.com/apis/ajaxsearch/faq/#license
> -->
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
> <html xmlns="http://www.w3.org/1999/xhtml";>
> <head>
> <meta http-equiv="content-type" content="text/html; charset=utf-8" /
>
> <title>Google Visualization API Sample</title>
> <script type="text/javascript" src="http://www.google.com/jsapi";></
> script>
> <script type="text/javascript">
> google.load('visualization', '1', {packages:
> ['annotatedtimeline']});
> function drawVisualization() {
> var data = new google.visualization.DataTable();
> data.addColumn('date', 'Date');
> data.addColumn('number', 'Sold Pencils');
> data.addColumn('string', 'title1');
> data.addColumn('string', 'text1');
> data.addColumn('number', 'Sold Pens');
> data.addColumn('string', 'title2');
> data.addColumn('string', 'text2');
> data.addRows(6);
> data.setValue(0, 0, new Date(2008, 1 ,1));
> data.setValue(0, 1, 30000);
> data.setValue(0, 4, 40645);
> data.setValue(1, 0, new Date(2008, 1 ,2));
> data.setValue(1, 1, 14045);
> data.setValue(1, 4, 20374);
> data.setValue(2, 0, new Date(2008, 1 ,3));
> data.setValue(2, 1, 55022);
> data.setValue(2, 4, 50766);
> data.setValue(3, 0, new Date(2008, 1 ,4));
> data.setValue(3, 1, 75284);
> data.setValue(3, 4, 14334);
> data.setValue(3, 5, 'Out of Stock');
> data.setValue(3, 6, 'Ran out of stock on pens at 4pm');
> data.setValue(4, 0, new Date(2008, 1 ,5));
> data.setValue(4, 1, 41476);
> data.setValue(4, 2, 'Bought Pens');
> data.setValue(4, 3, 'Bought 200k pens');
> data.setValue(4, 4, 66467);
> data.setValue(5, 0, new Date(2008, 1 ,6));
> data.setValue(5, 1, 33322);
> data.setValue(5, 4, 39463);
>
> var annotatedtimeline = new
> google.visualization.AnnotatedTimeLine(
> document.getElementById('visualization'));
> annotatedtimeline.draw(data, {'displayAnnotations': true});
>
> var annotatedtimeline2 = new
> google.visualization.AnnotatedTimeLine(
> document.getElementById('visualization2'));
> annotatedtimeline2.draw(data, {'displayAnnotations': true});
> }
>
> google.setOnLoadCallback(drawVisualization);
> </script>
> </head>
> <body style="font-family: Arial;border: 0 none;">
> <div id="visualization" style="width: 800px; height: 400px;"></div>
> <div id="visualization2" style="width: 800px; height: 400px;"></div>
> </body>
> </html>
>
> On Feb 11, 8:37 pm, ion <[email protected]> wrote:
>
> > Hi Margie,
> > I tested on my code and you can display 2 different graphs. The
> > difference was that I didn't use functions for every task that I
> > needed. Maybe it's something with js variables; you end up using the
> > same variable for chart. You can try to give different name to the 2
> > char variables. Also you can find out what div it's not used by
> > putting:
>
> > <div id='graph_div_bar' style='width: 900px; height: 300px;'> bar
> > div </div>
>
> > My guess it's that you all the time use the first div (when bar is
> > shown it is shown in "bar div", when foo it's shown it is shown also
> > in "bar div").
>
> > Sorry I can't help more.
>
> > Ion
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
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.
