Hi All,

Working on my first chart here (and am also new to Javascript, for
that matter). I've got something that works but not exactly the way I
think it should. I'm also using jQuery.

I have JSON data coming in via a file that gets refreshed after a
fixed period of time. I want to re-draw the graph once I've consumed
the new JSON data.

Here is the issue: I'm re-creating the DataTable object each time the
chart refreshes because I can't figure out how to update the existing
DataTable with a new JSON object. So, in order not to get a page that
re-fills with a bunch of new charts every 2 seconds, I have to clear
the chart div by doing:

 document.getElementById('chart_div').innerHTML = "";

Maybe this is ok, but is there a better way for me to update the chart
with the new data? Is the "right way" to parse the JSON object and
then run setCell()?

My code is pasted below.
Thank you,
ingrid

<html>
<head>
<script type="text/javascript" src="jquery-1.2.6.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi";></
script>

<script type="text/javascript">
  google.load("visualization", "1", {packages:["areachart"]});

  $(document).ready(function(){
                google.setOnLoadCallback(getData);
        });

        function drawChart(j) {
            var chart_div = document.getElementById('chart_div');
            var data = new google.visualization.DataTable(j, 0.5);
            var chart = new google.visualization.AreaChart(chart_div);
            var options = {width: 800, height: 440, legend: 'bottom', title:
'Activity per Second'};

            chart.draw(data, options);
            checkDraw();

        function checkDraw(){
                if(chart_div.innerHTML != ""){
                        setTimeout(getData, 2000);
                } else {
                        setTimeout(checkDraw, 1000);
                }
        }
    }

    function getData(){
                $.get("data.php",
                {ajax: 'true'},
                function(j){
                    document.getElementById('chart_div').innerHTML = "";
                    drawChart(j);
        },
        "json");
        }

  </script>
</head>
  <body>
  <div id="chart_div">Hold on a sec...</div>
  </body>
 </html>
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---

Reply via email to