thanks again for your help man, will try to fix it now. On Friday, November 16, 2012 1:20:50 AM UTC-5, asgallant wrote: > > There is an option that helps with the flickering, but you can't always > use it. See "allowRedraw" in the ATL > options<https://developers.google.com/chart/interactive/docs/gallery/annotatedtimeline#Configuration_Options>. > > Note this only applies to ATL charts, if you use the regular charts, there > is no flickering. If this presents a problem, there is an alternative to > ATL charts which involves using > LineCharts<https://developers.google.com/chart/interactive/docs/gallery/linechart>with > "annotation" and "annotationText" column > roles<https://developers.google.com/chart/interactive/docs/roles#annotationrole>in > combination with a > ChartRangeFilter<https://developers.google.com/chart/interactive/docs/gallery/controls#chartrangefilter>. > > This combo provides 95% of the functionality with all the other goodies > that the regular charts provide and without the problems of Flash. > > On Friday, November 16, 2012 12:03:37 AM UTC-5, sam wrote: >> >> I made it work, now chart flickers every time it updates >> >> On Thursday, November 15, 2012 10:34:21 PM UTC-5, asgallant wrote: >>> >>> Also, why do you have "crossdomain: true" in the AJAX? Isn't the HTML >>> page being served from the same server as your data? >>> >>> On Thursday, November 15, 2012 10:31:17 PM UTC-5, asgallant wrote: >>>> >>>> Open the page in Chrome, and look at the developer's console (hit >>>> ctrl+shift+j to open) - what error message(s) is it throwing? >>>> >>>> On Thursday, November 15, 2012 7:50:37 PM UTC-5, sam wrote: >>>>> >>>>> that doesn't really fix the issue >>>>> >>>>> On Wednesday, November 14, 2012 11:09:57 PM UTC-5, asgallant wrote: >>>>>> >>>>>> Off the top, I see your chart div's style isn't formatted correctly: >>>>>> >>>>>> <div id="chart_div" style="width: 800; height: 600"></div> >>>>>> >>>>>> should be: >>>>>> >>>>>> <div id="chart_div" style="width: 800px; height: 600px"></div> >>>>>> >>>>>> Setting height and width in the ATL chart's options doesn't do >>>>>> anything. >>>>>> >>>>>> On Wednesday, November 14, 2012 9:05:24 PM UTC-5, sam wrote: >>>>>>> >>>>>>> my bad, completely missed date format, fixed it, still no luck, >>>>>>> please see my js attached, >>>>>>> >>>>>>> thanks again >>>>>>> >>>>>>> On Wednesday, November 14, 2012 9:56:50 AM UTC-5, asgallant wrote: >>>>>>>> >>>>>>>> You changed your date format, what you had before was correct for >>>>>>>> using the JSON data table representation. Other than that, your data >>>>>>>> seems >>>>>>>> to be in the correct format (see example with a truncated set of your >>>>>>>> data >>>>>>>> and fixed dates here: http://jsfiddle.net/asgallant/2nFWK/). Fix >>>>>>>> the dates and test again. If it still doesn't work, then post your js >>>>>>>> code >>>>>>>> and I'll take a look at that. >>>>>>>> >>>>>>>> On Wednesday, November 14, 2012 4:22:18 AM UTC-5, sam wrote: >>>>>>>>> >>>>>>>>> attached json output I get, can you check it? I am pretty sure >>>>>>>>> it's correct though. >>>>>>>>> thanks >>>>>>>>> >>>>>>>>> On Tuesday, November 13, 2012 4:06:53 AM UTC-5, asgallant wrote: >>>>>>>>>> >>>>>>>>>> To debug the json, add colsole.log(json); in the AJAX query, and >>>>>>>>>> then check the developer's console in Chrome/Firefox to see what >>>>>>>>>> comes out. >>>>>>>>>> Make sure that you are using the json to create a new DataTable and >>>>>>>>>> not >>>>>>>>>> with the addRows method; it should be var data = new >>>>>>>>>> google.visualization.DataTable(json); in the success callback. >>>>>>>>>> >>>>>>>>>> On Monday, November 12, 2012 10:16:20 PM UTC-5, sam wrote: >>>>>>>>>>> >>>>>>>>>>> I did update my .php file according to code you provided, and >>>>>>>>>>> get jason in proper format, >>>>>>>>>>> >>>>>>>>>>> commented out addColumn in .html still no luck >>>>>>>>>>> >>>>>>>>>>> On Monday, November 12, 2012 8:34:35 PM UTC-5, asgallant wrote: >>>>>>>>>>>> >>>>>>>>>>>> Sorry, that's a typo, should have been $r. >>>>>>>>>>>> >>>>>>>>>>>> On Monday, November 12, 2012 8:22:17 PM UTC-5, sam wrote: >>>>>>>>>>>>> >>>>>>>>>>>>> in this particular cod snippet, where did $i come from? >>>>>>>>>>>>> >>>>>>>>>>>>> $sth = mysql_query("SELECT * FROM testpower WHERE datetime > 0"); >>>>>>>>>>>>> $rows = array(); >>>>>>>>>>>>> $flag = true; >>>>>>>>>>>>> >>>>>>>>>>>>> $table = array(); >>>>>>>>>>>>> >>>>>>>>>>>>> $table['cols'] = array( >>>>>>>>>>>>> >>>>>>>>>>>>> array('label' => 'date', 'type' => 'datetime'), >>>>>>>>>>>>> >>>>>>>>>>>>> array('label' => 'power', 'type' => 'number') >>>>>>>>>>>>> >>>>>>>>>>>>> ); >>>>>>>>>>>>> >>>>>>>>>>>>> $rows = array(); >>>>>>>>>>>>> while($r = mysql_fetch_assoc($sth)) { >>>>>>>>>>>>> $temp = array(); >>>>>>>>>>>>> >>>>>>>>>>>>> $temp[] = array('v' => $i['datetime']); // you will probably >>>>>>>>>>>>> need to transform this into the Date object format >>>>>>>>>>>>> $temp[] = array('v' => (float) $i['power']); // typecast to >>>>>>>>>>>>> int, float, whatever - if you don't, it will be interpreted as a >>>>>>>>>>>>> string >>>>>>>>>>>>> >>>>>>>>>>>>> $rows[] = array('c' => $temp); >>>>>>>>>>>>> } >>>>>>>>>>>>> >>>>>>>>>>>>> $table['rows'] = $rows; >>>>>>>>>>>>> >>>>>>>>>>>>> $jsonTable = json_encode($table); >>>>>>>>>>>>> >>>>>>>>>>>>> >>>>>>>>>>>>> On Monday, November 12, 2012 7:41:01 PM UTC-5, asgallant wrote: >>>>>>>>>>>>>> >>>>>>>>>>>>>> Yes, that's the format you need. Here's a basic bit of PHP >>>>>>>>>>>>>> code that shows how to build it: >>>>>>>>>>>>>> https://groups.google.com/d/msg/google-visualization-api/GK0zwNbIwUo/i9DhpOUSKMEJ >>>>>>>>>>>>>> >>>>>>>>>>>>>> On Monday, November 12, 2012 7:32:06 PM UTC-5, sam wrote: >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> are you talking about sampleData.json format? >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> same as in this example ? >>>>>>>>>>>>>>> https://developers.google.com/chart/interactive/docs/php_example >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> On Monday, November 12, 2012 6:46:31 PM UTC-5, asgallant >>>>>>>>>>>>>>> wrote: >>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>> Hmmm...I don't see anything wrong with the code, can you >>>>>>>>>>>>>>>> post a link to the live version on your school's server? >>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>> Incidentally, the data in the JSON won't work. Your >>>>>>>>>>>>>>>> numbers have to be unquoted, and the dates won't work as is. >>>>>>>>>>>>>>>> That date >>>>>>>>>>>>>>>> format is correct if you are using the JSON implementation of >>>>>>>>>>>>>>>> a DataTable, >>>>>>>>>>>>>>>> but not for using the addRows method. Given how you are >>>>>>>>>>>>>>>> fetching the data, >>>>>>>>>>>>>>>> you'll either have to process it in javascript before passing >>>>>>>>>>>>>>>> it to >>>>>>>>>>>>>>>> addRows, or change the data structure to use the full >>>>>>>>>>>>>>>> DataTable JSON >>>>>>>>>>>>>>>> structure. >>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>> On Monday, November 12, 2012 6:01:37 PM UTC-5, sam wrote: >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> thanks for reply asgallant, I built everything by reading >>>>>>>>>>>>>>>>> all your previous comments history, I was testing everything >>>>>>>>>>>>>>>>> locally on my >>>>>>>>>>>>>>>>> laptop using xampp got the 405 error, moved everything to my >>>>>>>>>>>>>>>>> school >>>>>>>>>>>>>>>>> provided space on .edu, same error. >>>>>>>>>>>>>>>>> all your previous comments on other threads are really >>>>>>>>>>>>>>>>> helpful. >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> my .php file output sample, it's really big file, just >>>>>>>>>>>>>>>>> showed a few lines, from echo json_encode($output); >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> [["Date(2012,04,12,12,50,02)","15662","5589","7999","2074","1488","425"],["Date(2012,04,12,1,00,03)","15662","5589","7999","2074","1488","425"],["Date(2012,04,12,1,10,02)","15242","5555","7603","2084","1430","413"]] >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> .html file : >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> <html> >>>>>>>>>>>>>>>>> <head> >>>>>>>>>>>>>>>>> <script type='text/javascript' src=' >>>>>>>>>>>>>>>>> http://www.google.com/jsapi'></script> >>>>>>>>>>>>>>>>> <script type="text/javascript" >>>>>>>>>>>>>>>>> src="jquery.min.js"></script> >>>>>>>>>>>>>>>>> <script type='text/javascript'> >>>>>>>>>>>>>>>>> google.load('visualization', '1', >>>>>>>>>>>>>>>>> {'packages':['annotatedtimeline']}); >>>>>>>>>>>>>>>>> google.setOnLoadCallback(drawChart); >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> function drawChart() { >>>>>>>>>>>>>>>>> var data = new google.visualization.DataTable(); >>>>>>>>>>>>>>>>> data.addColumn('datetime', 'Date'); >>>>>>>>>>>>>>>>> data.addColumn('number', 'n1'); >>>>>>>>>>>>>>>>> data.addColumn('number', 'n2'); >>>>>>>>>>>>>>>>> data.addColumn('number', 'n3'); >>>>>>>>>>>>>>>>> data.addColumn('number', 'n4'); >>>>>>>>>>>>>>>>> data.addColumn('number', 'n5'); >>>>>>>>>>>>>>>>> data.addColumn('number', 'n6'); >>>>>>>>>>>>>>>>> var now = new Date(); >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> var chart = new >>>>>>>>>>>>>>>>> google.visualization.AnnotatedTimeLine(document.getElementById('chart_div')); >>>>>>>>>>>>>>>>> function updateData () { >>>>>>>>>>>>>>>>> $.ajax({ >>>>>>>>>>>>>>>>> url: 'http://localhost/db_chartjson.php', >>>>>>>>>>>>>>>>> dataType: 'json', >>>>>>>>>>>>>>>>> type: 'POST', >>>>>>>>>>>>>>>>> crossDomain: true, >>>>>>>>>>>>>>>>> success: function (json) { >>>>>>>>>>>>>>>>> data.removeRows(0, data.getNumberOfRows()); >>>>>>>>>>>>>>>>> data.addRows(json); >>>>>>>>>>>>>>>>> chart.draw(data,{width: 400, height: 240}); >>>>>>>>>>>>>>>>> // refresh data in 1 minute >>>>>>>>>>>>>>>>> setTimeout(function () { >>>>>>>>>>>>>>>>> updateData(); >>>>>>>>>>>>>>>>> }, 60000); >>>>>>>>>>>>>>>>> } >>>>>>>>>>>>>>>>> }); >>>>>>>>>>>>>>>>> } >>>>>>>>>>>>>>>>> } >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> </script> >>>>>>>>>>>>>>>>> </head> >>>>>>>>>>>>>>>>> <body> >>>>>>>>>>>>>>>>> <div id='chart_div' ></div> >>>>>>>>>>>>>>>>> </body> >>>>>>>>>>>>>>>>> </html> >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> On Monday, November 12, 2012 5:50:49 PM UTC-5, asgallant >>>>>>>>>>>>>>>>> wrote: >>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>>> Can you post your source code? >>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>>> Since you're using xampp, I assume you're accessing the >>>>>>>>>>>>>>>>>> HTML file through the webserver rather than locally, but if >>>>>>>>>>>>>>>>>> you're not, >>>>>>>>>>>>>>>>>> then this could be a Flash security issue (see the >>>>>>>>>>>>>>>>>> Notes<https://developers.google.com/chart/interactive/docs/gallery/annotatedtimeline#notes>section >>>>>>>>>>>>>>>>>> in the ATL documentation for details). >>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>>> On Monday, November 12, 2012 5:22:37 PM UTC-5, sam wrote: >>>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>>>> Hi, >>>>>>>>>>>>>>>>>>> I am using mysql/php to create json data, in >>>>>>>>>>>>>>>>>>> addition have test.html that read json and draws annotated >>>>>>>>>>>>>>>>>>> timeline, >>>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>>>> keep getting "OPTIONS http://www.google.com/jsapi405 >>>>>>>>>>>>>>>>>>> (Method Not Allowed)" error >>>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>>>> "XMLHttpRequest cannot load >>>>>>>>>>>>>>>>>>> http://www.google.com/jsapi. Origin >>>>>>>>>>>>>>>>>>> http://nova.it.rit.edu is not allowed by >>>>>>>>>>>>>>>>>>> Access-Control-Allow-Origin." >>>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>>>> need urgent help, I am using xampp >>>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>>>> thanks >>>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>>>
-- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To view this discussion on the web visit https://groups.google.com/d/msg/google-visualization-api/-/V4p1gIrxDT0J. 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.
