Using CSV data

If the data has nulls, can the column type be inferred?

by dlaliberte

HTML

<script src="http://www.google.com/jsapi"></script>

<script src="http://code.jquery.com/jquery-1.10.1.min.js"> </script>
<script src="http://jquery-csv.googlecode.com/git/src/jquery.csv.js"></script>

<title>Environmental Temperatures</title>


<!--  The Google DAY Chart is drawn below plus my old "LogTemp" App charts (WEEK/MONTH) which I haven't converted yet. -->
    <div id="chart_div" > </div>


	<p class="padding">
        <ximg src="logtemp/week.jpg" alt="The Week Temps" /><br />
  	<br />
	  <ximg src="logtemp/month.jpg" alt="The Month Temps" />
    </p>

CSS

.padding {padding-left: 40px;}

JavaScript

var csvString = 
'Time,Dwn,Dwn,Mid,Mid,Out,Out,Frzr,Frzr,Frig,Frig\n' +
'0,70.0,,70.0,,30.2,,.1,,46,\n' +
'.17,70.0,,70.0,,29.3,,1.1,,46,\n' +
'9.5,71.0,,71.0,,30.2,,-2,,33.4,\n' +
'9.67,,,,,,,,,,\n' +
'9.83,,,,,,,,,,\n' +
'23.67,70.0,,70.0,,30.2,,-3,,45.1,\n' +
'23.83,70.0,,70.0,,30.2,,-1.5,,45.5,\n';
    
    
    // Load the Visualization API from Google and set Listener
google.load("visualization", "1.1", {packages:["corechart","table"]});
google.setOnLoadCallback(drawChart);


// this has to be a global function
function drawChart() {

//    grab the CSV data and ready it for charting
   //$.get("https://drive.google.com/a/google.com/file/d/0B8S-bvpRqjoiVlE3TmUyVk1zMWZ2T0ZVYzJoTUVUWXQyd3pn/view?usp=sharing", function(csvString) {
		 // transform the CSV string into a 2-dimensional array
		var arrayData = $.csv.toArrays(csvString, {onParseValue: $.csv.hooks.castToScalar});
		// alert (arrayData[0]+ '\n' +  arrayData[1]);  //debug code to verify array contents
		//alert(arrayData.join('\n'));  //this dumps the first and last portions of the array

//		This new DataTable object holds all the data in Charting format
		var data = google.visualization.arrayToDataTable(arrayData);
    //debugger;
   		var view = new google.visualization.DataView(data);
		view.setColumns([
			{sourceColumn: 0, type: "number"},
			{sourceColumn: 1, type: "number"},
			{sourceColumn: 2, type: "number"},
			{sourceColumn: 3, type: "number"},
			{sourceColumn: 4, type: "number"},
			{sourceColumn: 5, type: "number"},
			{sourceColumn: 6, type: "number"},
			{sourceColumn: 7, type: "number"},
			{sourceColumn: 8, type: "number"},
			{sourceColumn: 9, type: "number"},
			{sourceColumn: 10, type: "number"},
			]);
		var vStart = -20;
		var vTicks = [];
		while (vStart <= 100) {
			vTicks.push(vStart);
			vStart+=10;
		}
		var hStart = 0;
		var hTicks = [];
		while (hStart <= 24) {
			hTicks.push(hStart);
			hStart+=1;
		}

		var d = new Date()
		var days =...