D3 Examples - D3 Reusable Chart

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <style>
      body {
        font: 20px sans-serif;
        fill: #444;
      }
​
      .axis path,
      .axis line {
        fill: none;
        stroke: grey;
        shape-rendering: crispEdges;
      }
    </style>
  </head>
  <body>
    <div id="chart"></div>
    <script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
    <script src="scatter_plot.js" charset="utf-8"></script>
    <script type="text/javascript" charset="utf-8">
      var chart = scatterPlot()
        .x(function (d) { return d.median_age; })
        .y(function (d) { return d.edu_index; })
        .radius(function (d) { return Math.log(d.gdp); })
        .axisX({ title: "Median Age" })
        .axisY({ title: "Education Index" });
​
      d3.csv("country.csv", function (data) {
        d3.select("#chart")
          .datum(data)
          .call(chart);
      });
    </script>
  </body>
</html>
    