<!DOCTYPE html>
<head>
    <meta charset="utf-8" />
    <script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script>
    <style type="text/css">
        .axis path,
        .axis line 
        {
            fill: none;
            stroke: black;
            shape-rendering: crispEdges;
        }

        .axis text 
        {
            font-family: sans-serif;
            font-size: 11px;
        }
    </style>
</head>
<body style="text-align: center;">
    <div style="padding: 10px;">
        <h3>Initial Scatterplot Example</h3>
        <script type="text/javascript" src="scatterplot.js"></script>
    </div>
    <div style="padding: 10px;"> 
        <h3>Final Scatterplot Example</h3>
        <script type="text/javascript" src="scatterplot_final.js"></script>
    </div>
    <div style="padding: 10px;">
        <h3>Fun Transitions!</h3>
        <script type="text/javascript" src="transitions.js"></script>
    </div>
</body>