[visualization-api] Display chart via function

2014-09-10 Thread isaachorrocks 
This is probably so simple it's an insult to your intelligence, but what's 
wrong with this code. I want the chart to display when clicking the button 
- it just hangs. If I take away the definition of the dspChart function the 
chart draws fine.

html
head

!--Load the AJAX API--
script type=text/javascript src=https://www.google.com/jsapi;/script
script type=text/javascript

function dspChart() {
google.load('visualization', '1', {'packages':['corechart']});
google.setOnLoadCallback(drawChart);
}

function drawChart() {
// Create our data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Topping');
data.addColumn('number', 'Slices');
data.addRows([
  ['Mushrooms', 3],
  ['Onions', 1]
  ]);
// Instantiate and draw our chart, passing in some options.
var chart = new 
google.visualization.PieChart(document.getElementById('fig'));
chart.draw(data, null);
}

/script
/head

body
input type=button value=display chart onclick=dspChart();
div id=fig/div
/body
/html



-- 
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+unsubscr...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.

Re: [visualization-api] Display chart via function

2014-09-10 Thread 'Jon Orwant' via Google Visualization API 
Why not move the google.load call above dspChart(), remove dspChart(), and
use onclick=drawChart(); ?

Jon

On Wed, Sep 10, 2014 at 10:21 AM, isaachorro...@gmail.com wrote:

 This is probably so simple it's an insult to your intelligence, but what's
 wrong with this code. I want the chart to display when clicking the button
 - it just hangs. If I take away the definition of the dspChart function the
 chart draws fine.

 html
 head

 !--Load the AJAX API--
 script type=text/javascript src=https://www.google.com/jsapi
 /script
 script type=text/javascript

 function dspChart() {
 google.load('visualization', '1', {'packages':['corechart']});
 google.setOnLoadCallback(drawChart);
 }

 function drawChart() {
 // Create our data table.
 var data = new google.visualization.DataTable();
 data.addColumn('string', 'Topping');
 data.addColumn('number', 'Slices');
 data.addRows([
   ['Mushrooms', 3],
   ['Onions', 1]
   ]);
 // Instantiate and draw our chart, passing in some options.
 var chart = new
 google.visualization.PieChart(document.getElementById('fig'));
 chart.draw(data, null);
 }

 /script
 /head

 body
 input type=button value=display chart onclick=dspChart();
 div id=fig/div
 /body
 /html



  --
 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+unsubscr...@googlegroups.com.
 To post to this group, send email to
 google-visualization-api@googlegroups.com.
 Visit this group at
 http://groups.google.com/group/google-visualization-api.
 For more options, visit https://groups.google.com/d/optout.


-- 
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+unsubscr...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.

Re: [visualization-api] Display chart via function

2014-09-10 Thread Isaac Horrocks 
Agreed that works. Many thanks. Do you know why the google.load doesn't
work within the function. Is it to do with scope in Javascript?

On 10 September 2014 16:22, 'Jon Orwant' via Google Visualization API 
google-visualization-api@googlegroups.com wrote:

 Why not move the google.load call above dspChart(), remove dspChart(), and
 use onclick=drawChart(); ?

 Jon

 On Wed, Sep 10, 2014 at 10:21 AM, isaachorro...@gmail.com wrote:

 This is probably so simple it's an insult to your intelligence, but
 what's wrong with this code. I want the chart to display when clicking the
 button - it just hangs. If I take away the definition of the dspChart
 function the chart draws fine.

 html
 head

 !--Load the AJAX API--
 script type=text/javascript src=https://www.google.com/jsapi
 /script
 script type=text/javascript

 function dspChart() {
 google.load('visualization', '1', {'packages':['corechart']});
 google.setOnLoadCallback(drawChart);
 }

 function drawChart() {
 // Create our data table.
 var data = new google.visualization.DataTable();
 data.addColumn('string', 'Topping');
 data.addColumn('number', 'Slices');
 data.addRows([
   ['Mushrooms', 3],
   ['Onions', 1]
   ]);
 // Instantiate and draw our chart, passing in some options.
 var chart = new
 google.visualization.PieChart(document.getElementById('fig'));
 chart.draw(data, null);
 }

 /script
 /head

 body
 input type=button value=display chart onclick=dspChart();
 div id=fig/div
 /body
 /html



  --
 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+unsubscr...@googlegroups.com.
 To post to this group, send email to
 google-visualization-api@googlegroups.com.
 Visit this group at
 http://groups.google.com/group/google-visualization-api.
 For more options, visit https://groups.google.com/d/optout.


  --
 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/xXxPljzWWRA/unsubscribe
 .
 To unsubscribe from this group and all its topics, send an email to
 google-visualization-api+unsubscr...@googlegroups.com.
 To post to this group, send email to
 google-visualization-api@googlegroups.com.
 Visit this group at
 http://groups.google.com/group/google-visualization-api.
 For more options, visit https://groups.google.com/d/optout.


-- 
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+unsubscr...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.

Re: [visualization-api] Display chart via function

2014-09-10 Thread Andrew Gallant 
The reason it doesn't work has to do with some quirky behavior of the 
google loader.  If you had used an inline callback, it would have worked, 
eg;

function dspChart() {
google.load('visualization', '1', {'packages':['corechart'], callback: 
drawChart});
}

But I don't recommend calling google.load inside another function, unless 
you have a very specific reason for doing so.  Generally speaking, having 
the browser load the API asynchronously and in parallel with other assets 
will result in getting charts drawn faster.  In your specific case, calling 
the loader from a button click, you introduce latency between clicking the 
button and seeing a chart appear as the API doesn't start loading until the 
button is clicked.  Also, if you clicked the button a second time, the 
google loader would see that the API is already loaded and do nothing - not 
even firing the callback, so your chart would not redraw.

On Wednesday, September 10, 2014 12:06:42 PM UTC-4, Isaac Horrocks wrote:

 Agreed that works. Many thanks. Do you know why the google.load doesn't 
 work within the function. Is it to do with scope in Javascript?

 On 10 September 2014 16:22, 'Jon Orwant' via Google Visualization API 
 google-visua...@googlegroups.com javascript: wrote:

 Why not move the google.load call above dspChart(), remove dspChart(), 
 and use onclick=drawChart(); ?

 Jon

 On Wed, Sep 10, 2014 at 10:21 AM, isaach...@gmail.com javascript: 
 wrote:

 This is probably so simple it's an insult to your intelligence, but 
 what's wrong with this code. I want the chart to display when clicking the 
 button - it just hangs. If I take away the definition of the dspChart 
 function the chart draws fine.

 html
 head

 !--Load the AJAX API--
 script type=text/javascript src=https://www.google.com/jsapi
 /script
 script type=text/javascript

 function dspChart() {
 google.load('visualization', '1', {'packages':['corechart']});
 google.setOnLoadCallback(drawChart);
 }

 function drawChart() {
 // Create our data table.
 var data = new google.visualization.DataTable();
 data.addColumn('string', 'Topping');
 data.addColumn('number', 'Slices');
 data.addRows([
   ['Mushrooms', 3],
   ['Onions', 1]
   ]);
 // Instantiate and draw our chart, passing in some options.
 var chart = new 
 google.visualization.PieChart(document.getElementById('fig'));
 chart.draw(data, null);
 }

 /script
 /head

 body
 input type=button value=display chart onclick=dspChart();
 div id=fig/div
 /body
 /html



  -- 
 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+unsubscr...@googlegroups.com 
 javascript:.
 To post to this group, send email to google-visua...@googlegroups.com 
 javascript:.
 Visit this group at 
 http://groups.google.com/group/google-visualization-api.
 For more options, visit https://groups.google.com/d/optout.


  -- 
 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/xXxPljzWWRA/unsubscribe
 .
 To unsubscribe from this group and all its topics, send an email to 
 google-visualization-api+unsubscr...@googlegroups.com javascript:.
 To post to this group, send email to google-visua...@googlegroups.com 
 javascript:.
 Visit this group at 
 http://groups.google.com/group/google-visualization-api.
 For more options, visit https://groups.google.com/d/optout.




-- 
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+unsubscr...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.