D3 Examples - ParseCSV example

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
<meta name="description" content="Parse CSV">
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
​
</body>
<script>
// from https://www.youtube.com/watch?v=iuA-gmvJ5n0&list=PL9yYRbwpkyktAZaphR2UfeYpgNGnIqjs9&index=10
​
function parseCSV(string, accessor) {
  
  if (!accessor) {
    accessor = function(d) { return d };
  };
  
  var lines = string.split("\n"),
      columnNames = lines[0].split(","),
      rows = lines.slice(1);
  return rows.map(function(row) {
      var entries = row.split(","),
          rowObject = {};
      
      columnNames.forEach(function(colName, i) {
        rowObject[colName] = entries[i];
      });
      return accessor(rowObject);
  });
  
}
​
​
​
​
iris_data = "sepal_length,sepal_width,petal_length,petal_width,class\n\
5.1,3.5,1.4,0.2,Iris-setosa\n\
4.9,3.0,1.4,0.2,Iris-setosa\n\
4.7,3.2,1.3,0.2,Iris-setosa\n\
4.6,3.1,1.5,0.2,Iris-setosa\n\
5.0,3.6,1.4,0.2,Iris-setosa\n\
5.4,3.9,1.7,0.4,Iris-setosa;"
​
data = parseCSV(iris_data, function(rowObject) {
  rowObject["sepal_length"] = +rowObject["sepal_length"];
  rowObject["sepal_width"] = +rowObject["sepal_width"];
  rowObject["petal_length"] = +rowObject["petal_length"];
  rowObject["petal_width"] = +rowObject["petal_width"];
  
  return rowObject;
})
​
d3Data = d3.csv.parse(iris_data)
console.log(data)
​
console.log("---------D3-----------")
console.log(d3Data)  
</script>
</html>
    