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/jsapi 405 >>>>>>>>>>>>>>>> (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/-/uT5D7Xuf4ckJ. 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.
