D3 Examples - Unemployment in Spain test

xxxxxxxxxx
 
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Loading CSV Data with D3</title>
        <style type="text/css">
​
        h1 {
                font-family: Helvetica;
                font-size: 40px;
                font-weight: bold;
                border-top: solid 10px red;
            }
​
            h2 {
                font-family: Helvetica;
                font-size: 24px;
                font-weight: bold;
            }
​
            p {
                font-family: Helvetica;
                font-size: 20px;
                font-style: italic;
            }
        </style>
        <script type="text/javascript" src="https://d3js.org/d3.v3.js"></script>
    </head>
    <body>
        <h1>MODULE 2 EXERCISE</h1>
        <h2>SVG IMAGE AND DATA LOGGED INTO THE CONSOLE </h2>
        <p> Here it is!! My colorful Easter Egg! I'm so happy I managed!! :)</p>
        <p> Find my data about unemployment in Spain (unfortunately not so fun) in the console</p>
        <svg width="700" height="500">
        <ellipse cx="300" cy="250" rx="100" ry="150" fill="yellow"></ellipse>
            <circle cx="300" cy="140" r="20" fill="violet" />
            <circle cx="240" cy="220" r="15" fill="red" stroke="purple" stroke-width="5"/>
            <circle cx="350" cy="190" r="15" fill="orange" stroke="blue" stroke-width="5"/>
            <circle cx="370" cy="280" r="20" fill="blue" />
            <circle cx="320" cy="360" r="15" fill="green" stroke="orange" stroke-width="5" />
            <circle cx="245" cy="320" r="20" fill="purple" />
            <polygon points="300,180 325,230 275,230" fill="green"/>
            <polygon points="320,275 345,320 295,320" fill="red"/>
            <text x="270" y="250" fill="black" font-size="20" font-weight="bold" font-family="Helvetica">Happy</text>
            <text x="270" y="272" fill="black" font-size="20" font-weight="bold" font-family="Helvetica">Easter</text>
            
        </svg>
​
​
        <script type="text/javascript">     
​
​
            //Load in contents of CSV file
            d3.csv("Unemployment in Spain.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>
​
    </body>
</html>
    