olympic-2.html

---
layout: default
title: olympic
---

<svg width="720" height="120">
  <g id="dataCircles"></g>

</svg>

<script>

//d3.text("data/textData.txt", function(error, data) {
  //if (error) {
    //console.log(error.status, error.statusText);
  //}
  //console.log(error, data);


//});

 d3.csv("data/Olympic.csv", function(error, data) {
   if (error) {
   console.log(error.status, error.statusText);
   }
   else{
 //not needed using json
     console.log(data);
     data.forEach(function(dataPoint){
        dataPoint.x = parseFloat(dataPoint.x);
        dataPoint.size = parseFloat(dataPoint.size);
     });
// //not needed using json
    // draw(data);
    console.log(data);
  }
});





// function draw(data) {
//   var circle = d3.select("g#dataCircles").selectAll("rect")
//     .data(data,function(d){
//       return d.color;
//     });
//
//     circle.enter().append("rect")
//         .attr("y", 60)
//         .style("fill", function(d){
//           return d.color;
//         })
//         .attr("width", 0)
//         .attr("height", 0);
//
//
//
// circle.transition().duration(1000)
//   .attr("width", function(d){
//     return d.size;
//   })
//   .attr("height", function(d){
//     return d.size;
//   })
//   .style("fill", function(d){
//     return d.color;
//   })
//   .attr("x", function(d){
//     return d.x;
//   });
//
//   circle.exit().transition().duration(1000)
//     .attr("r", 0).remove;
//
// }





</script>