Hey Sergey thanks very much i got my code working. On Friday, 24 January 2014 17:13:58 UTC+1, Sergey wrote: > > In csvColumns, you need to specify the *type* of the column, not its > title. You can specify its title in the actual CSV, if you set csvHasHeader > to true and make the first row be titles. > > - Sergey > > > On Fri, Jan 24, 2014 at 10:15 AM, Ashok Kumar <[email protected]<javascript:> > > wrote: > >> Thanks Sergey for the help however now i am getting a different error >> Uncaught >> ReferenceError: High is not defined. Find below my revised code. >> >> <!DOCTYPE html> >> <html> >> <head> >> <title>Google Chart Example</title> >> <script src="https://www.google.com/jsapi"></script> >> <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> >> <script src="http://localhost/jquery.csv-0.71.js"></script> >> <script type="text/javascript"> >> google.load("visualization", "1", {packages:["corechart"]}); >> </script> >> <script> >> function drawChart() >> { >> //$.get("http://localhost/output.csv",function(csvString) >> //{ >> var queryOptions = >> { >> csvColumns: ['High','Low'], >> csvHasHeader: false >> } >> csvUrl= 'http://localhost/temperatures.csv'; >> var query = new google.visualization.Query(csvUrl,queryOptions); >> //var query = new google.visualization.Query(' >> http://spreadsheets.google.com/tq?key=pCQbetd-CptGXxxQIG7VFIQ&range=B1:D11&pub=1' >> ); >> //var arrayData = $.csv.toArrays(csvString, {onParseValue: >> $.csv.hooks.castToScalar}); >> query.setQuery('select A,B'); >> query.send(handleQueryResponse); >> function handleQueryResponse(response) >> { >> if (response.isError()) >> { >> alert('Error in query: ' + response.getMessage() + ' ' + >> response.getDetailedMessage()); >> return; >> } >> var data = response.getDataTable(); >> var chart = new >> google.visualization.ColumnChart(document.getElementById('chart')); >> chart.draw(data, {width: 400, height: 240, is3D: true}); >> } >> /*var data = new google.visualization.arrayToDataTable(arrayData); >> console.log (arrayData); >> var view = new google.visualization.DataView(data); >> view.setColumns([0,1,2]); >> var options = >> { >> title: "KwaZulu-Natal Household Survey (1993)", >> vAxis: {title: "Year"}, >> hAxis: {title: "Cups"}, >> legend: 'none' >> } >> var chart = new >> google.visualization.ColumnChart(document.getElementById('chart')); >> chart.draw(view, options); */ >> //}); >> } >> google.setOnLoadCallback(drawChart); >> </script> >> </head> >> <body> >> <div id="chart"> >> </div> >> </body> >> </html> >> >> On Friday, 24 January 2014 14:31:22 UTC+1, Ashok Kumar wrote: >>> >>> Hi, >>> >>> I am using CSV file as an external data source and would need to >>> generate charts using the google chart api. However i am getting an error >>> that "Error in Query[404 not found]". I have both my csv file and the >>> actual Javascript in my local host (IIS) folder. >>> >>> <!DOCTYPE html> >>> <html> >>> <head> >>> <title>Google Chart Example</title> >>> <script src="https://www.google.com/jsapi"></script> >>> <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> >>> <script src="http://localhost/jquery.csv-0.71.js"></script> >>> <script type="text/javascript"> >>> google.load("visualization", "1", {packages:["corechart"]}); >>> </script> >>> <script> >>> function drawChart() >>> { >>> //$.get("http://localhost/output.csv",function(csvString) >>> //{ >>> *var query = new >>> google.visualization.Query('csv?url=http://localhost/temperatures.csv' >>> <http://localhost/temperatures.csv'>);* >>> //var query = new google.visualization.Query('ht >>> tp://spreadsheets.google.com/tq?key=pCQbetd- >>> CptGXxxQIG7VFIQ&range=B1:D11&pub=1'); >>> //var arrayData = $.csv.toArrays(csvString, {onParseValue: >>> $.csv.hooks.castToScalar}); >>> query.setQuery('select Time,Min,Max'); >>> query.send(handleQueryResponse); >>> function handleQueryResponse(response) >>> { >>> if (response.isError()) >>> { >>> alert('Error in query: ' + response.getMessage() + ' ' + >>> response.getDetailedMessage()); >>> return; >>> } >>> var data = response.getDataTable(); >>> var chart = new google.visualization.ColumnChart(document. >>> getElementById('chart')); >>> chart.draw(data, {width: 400, height: 240, is3D: true}); >>> } >>> /*var data = new google.visualization.arrayToDataTable(arrayData); >>> console.log (arrayData); >>> var view = new google.visualization.DataView(data); >>> view.setColumns([0,1,2]); >>> var options = >>> { >>> title: "KwaZulu-Natal Household Survey (1993)", >>> vAxis: {title: "Year"}, >>> hAxis: {title: "Cups"}, >>> legend: 'none' >>> } >>> var chart = new google.visualization.ColumnChart(document. >>> getElementById('chart')); >>> chart.draw(view, options); */ >>> //}); >>> } >>> google.setOnLoadCallback(drawChart); >>> </script> >>> </head> >>> <body> >>> <div id="chart"> >>> </div> >>> </body> >>> </html> >>> >>> Please help me with this. >>> >>> Regards, >>> Ashok >>> >> -- >> 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 [email protected]<javascript:> >> . >> To post to this group, send email to >> [email protected]<javascript:> >> . >> Visit this group at >> http://groups.google.com/group/google-visualization-api. >> For more options, visit https://groups.google.com/groups/opt_out. >> > >
-- 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 [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/groups/opt_out.
