Hi LH,
Thanks dudu.. I have implemented time line chart using jquery.. Thanks
once again for your suggestion
- arsh
On Nov 8, 12:27 am, LH <[EMAIL PROTECTED]> wrote:
> Hi,
>
> We're doing more or less exactly this (or were; it's gotten more
> complex now).
>
> What we've ended up doing is calling
> google.load("visualization", "1", {packages:["annotatedtimeline"]});
>
> BEFORE we load up jquery.
>
> Then the chart gets drawn once the DOM is ready; something like:
> $(document).ready(function() {
> drawChart()
>
> };
>
> That's the basic structure, anyway; the google.load, jquery.load and $
> (document).ready calls are each in their own javascript tag, FWIW.
>
> Hope this helps.
>
> On Nov 6, 12:58 pm, Arshad <[EMAIL PROTECTED]> wrote:
>
> > Visualization: Annotated Time Line
>
> > Hi,
>
> > I am working woth Google Visualizatoin API – “Time Line Chart”.
> > Everything is working fine with chart… But I am facing a problem with
> > “Time Line Chart” when I am using to this with jQuery :
>
> > Problem:
>
> > When I am calling to
> > google.load("visualization", "1", {packages:["annotatedtimeline"]});
> > google.setOnLoadCallback(drawChart); )
>
> > inside of jquery method
>
> > $(document).ready(function(){
> > google.load("visualization", "1", {packages:
> > ["annotatedtimeline"]});
> > google.setOnLoadCallback(drawChart);
> > });
>
> > Error:
>
> > Page is showing processing continuosly and display is not appear.
>
> > Example:
> > <html>
> > <head>
> > <script type="text/javascript" src="jquery.js"></script>
> > <script type="text/javascript" src="http://www.google.com/jsapi";></
> > script>
> > <script type="text/javascript">
> > $(document).ready(function(){
> > google.load("visualization", "1", {packages:
> > ["annotatedtimeline"]});
> > google.setOnLoadCallback(drawChart);
> > });
>
> > function drawChart() {
> > 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 chart = new
> > google.visualization.AnnotatedTimeLine(document.getElementById('chart_div'));
> > chart.draw(data, {displayAnnotations: true});
> > }
> > </script>
> > </head>
>
> > <body>
> > <div id="chart_div" style="width: 700px; height: 240px;"></div>
> > </body>
> > </html>
>
> > Please let me know about solution on above given exaple
>
> > Thanks
> > - arsh
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---
