block by EE2dev 593a54feb30ceed37cebf12ff6bba057

reading csv v5

Full Screen

Built with blockbuilder.org

forked from EE2dev‘s block: reading csv v4

index.html

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v5.min.js"></script>
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
  </style>
</head>

<body>
  <script>
    d3.csv("votiOne.csv").then(function(data) {

      var canvas = d3.select("body")
          .append("svg")
          .attr("width", 500)
          .attr("height", 500);

      canvas.selectAll("rect")
          .data(data)
          .enter()
              .append("rect")
              .attr("width", function (d) { return d.Grade; })
              .attr("height", 50)
              .attr("y", function (d, i) { return i * 50; })
              .attr("fill", "blue");

    })
  </script>
</body>

votiOne.csv

Name,Grade
John,95
Jennifer,96
Hank,100
Christina,98
Paul,88
Amy,76
Raul,72
Samantha,70
Sean,68
Abby,90
Sally,85