D3 Examples - Oakland Campaign Finance

xxxxxxxxxx
 
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Loading CSV Data with D3</title>
        <script type="text/javascript" src="https://d3js.org/d3.v3.js"></script>
        <link href='https://fonts.googleapis.com/css?family=Roboto+Slab' rel='stylesheet' type='text/css'>
        <style type="text/css">
            
            body {
                background-color: #14e7a5;
            }
​
            svg {
                background-color: #ff2646;
            }
​
            p {font-family: Roboto Slab;
                text-align: center;
            }
​
        </style>
    </head>
    <body>
​
        <p>WHAT IS IN THE CONSOLE?!</p>
​
        <script type="text/javascript">     
​
​
            //Load in contents of CSV file
            d3.csv("CampaignFinance_MonetaryContributions.csv", function(data) {
​
                //Now CSV contents have been transformed into
                //an array of JSON objects.
​
                //Log 'data' to the console, for verification.
            
                console.log(data);
​
            });
​
​
        </script>
​
<svg width=100% height="400">
            <polygon points ="10, 10 210, 10 390, 290 10, 80" style="fill: #8C8C8C; stroke: white; stroke-width:1"/>
            <polygon points ="500 480, 600 480, 390 290" style="fill: #8C8C8C; stroke: white; stroke-width:1"/>
<!--            <circle cx="300" cy="140" r="80" fill="white" /> -->
            <text x="20" y="380" fill="charcoal" font-size="30" font-weight="bold" font-family="Roboto Slab">looking at campaign finance data</text>
        </svg>
​
    </body>
</html>
    