emagee/cocoa2_2-final.csv

## cocoa2_2-final.csv

          
            Source
            1999
            2000
            2001
            2002
            2003
            2004
            2005
            2006
            2007
            2008
            2009
            2010
            2011
            2012
            2013

            
              CANADA
              333.2
              377.7
              442.8
              514.0
              686.7
              705.4
              699.2
              690.0
              709.9
              742.8
              630.5
              839.6
              910.6
              961.7
              1011.9

            
              MEXICO
              27.0
              29.9
              33.8
              49.9
              65.7
              79.7
              99.2
              124.4
              141.2
              213.1
              347.3
              430.8
              511.5
              499.4
              484.9

            
              GERMANY
              28.3
              37.5
              53.4
              50.6
              50.8
              43.7
              49.5
              59.3
              76.0
              69.4
              65.8
              89.3
              111.6
              132.1
              150.8

            
              BELGIUM-LUX.
              45.2
              45.9
              52.8
              48.8
              59.0
              67.8
              73.1
              86.6
              99.8
              87.0
              76.5
              86.5
              111.8
              116.3
              120.7

            
              SWITZERLAND
              24.6
              19.1
              18.7
              21.7
              24.4
              32.7
              38.3
              46.0
              55.7
              56.0
              44.9
              47.6
              56.6
              46.9
              53.5

            
              ITALY
              10.8
              10.6
              14.4
              13.9
              15.2
              16.1
              22.3
              28.7
              27.7
              35.8
              23.5
              24.9
              33.4
              31.3
              41.3

            
              FRANCE
              18.9
              18.5
              20.1
              21.2
              24.5
              28.5
              33.6
              41.4
              43.9
              41.3
              34.9
              36.8
              34.4
              35.3
              38.1

            
              REST OF WORLD
              100.8
              109.7
              129.4
              130.5
              149.3
              172.5
              199.7
              203.4
              185.6
              195.8
              149.0
              147.2
              183.0
              202.6
              217.8

## index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>SVG, CSV, ETC</title>
    <style>
        body {
            background-color: OrangeRed;
        }
        .smile {
            stroke: red;
            stroke-width: 7;
            stroke-linecap: round;
            fill: none;
        }
        p {
        color: white;
        font-family: Helvetica, sans-serif;
        font-size: 26px;
        padding-left: 6px;
        }
    </style>
    <script type="text/javascript" src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
</head>
<body>

    <svg width="320" height="330" >

        <circle cx="160" cy="160" r="150" fill="yellow" />
        <ellipse cx="115" cy="130" rx="13" ry="23" fill="black" />
        <ellipse cx="205" cy="130" rx="13" ry="23" fill="black" />
        <path d="M115,205 C140,220 140,290 205,205" class="smile"/>

    </svg>
    <div>
    <p>Check the console, please.</p>
    </div>

    <script>
        d3.csv("cocoa2_2-final.csv", function(data) {
            console.log(data);
            });
    </script>
</body>
</html>
Source	1999	2000	2001	2002	2003	2004	2005	2006	2007	2008	2009	2010	2011	2012	2013
CANADA	333.2	377.7	442.8	514.0	686.7	705.4	699.2	690.0	709.9	742.8	630.5	839.6	910.6	961.7	1011.9
MEXICO	27.0	29.9	33.8	49.9	65.7	79.7	99.2	124.4	141.2	213.1	347.3	430.8	511.5	499.4	484.9
GERMANY	28.3	37.5	53.4	50.6	50.8	43.7	49.5	59.3	76.0	69.4	65.8	89.3	111.6	132.1	150.8
BELGIUM-LUX.	45.2	45.9	52.8	48.8	59.0	67.8	73.1	86.6	99.8	87.0	76.5	86.5	111.8	116.3	120.7
SWITZERLAND	24.6	19.1	18.7	21.7	24.4	32.7	38.3	46.0	55.7	56.0	44.9	47.6	56.6	46.9	53.5
ITALY	10.8	10.6	14.4	13.9	15.2	16.1	22.3	28.7	27.7	35.8	23.5	24.9	33.4	31.3	41.3
FRANCE	18.9	18.5	20.1	21.2	24.5	28.5	33.6	41.4	43.9	41.3	34.9	36.8	34.4	35.3	38.1
REST OF WORLD	100.8	109.7	129.4	130.5	149.3	172.5	199.7	203.4	185.6	195.8	149.0	147.2	183.0	202.6	217.8
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8" />
	<title>SVG, CSV, ETC</title>
	<style>
	body {
	background-color: OrangeRed;
	}
	.smile {
	stroke: red;
	stroke-width: 7;
	stroke-linecap: round;
	fill: none;
	}
	p {
	color: white;
	font-family: Helvetica, sans-serif;
	font-size: 26px;
	padding-left: 6px;
	}
	</style>
	<script type="text/javascript" src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
	</head>
	<body>

	<svg width="320" height="330" >

	<circle cx="160" cy="160" r="150" fill="yellow" />
	<ellipse cx="115" cy="130" rx="13" ry="23" fill="black" />
	<ellipse cx="205" cy="130" rx="13" ry="23" fill="black" />
	<path d="M115,205 C140,220 140,290 205,205" class="smile"/>

	</svg>
	<div>
	<p>Check the console, please.</p>
	</div>

	<script>
	d3.csv("cocoa2_2-final.csv", function(data) {
	console.log(data);
	});
	</script>
	</body>
	</html>