D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
rvalerob
Full window
Github gist
Neet Project Test
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Loading CSV Data with D3</title> <link rel="stylesheet" type="text/css" href="styles.css"> <script type="text/javascript" src="https://d3js.org/d3.v3.js"></script> </head> <body> <h1>NEET</h1> <h2>Young people Not in Employment, Education or Training</h2> <h3>Intro</h3> <p>Not much to see here; just a nice <abbr title="Scalable Vector Graphics">SVG</abbr> image. Try looking in the console! Just press the keys <code>Ctrl+Shift+J</code> and you'll see the contents of my <abbr title="Comma-separated values">csv</abbr> file.</p> <h3>SVG image</h3> <p>This is my first <abbr title="Scalable Vector Graphics">SVG</abbr> image ever. Hope you like it!</p> <svg width="360" height="220"> <circle cx="65" cy="65" r="50" fill="none" stroke="#00298C" stroke-width="8"/><!--blue--> <circle cx="180" cy="65" r="50" fill="none" stroke="#000" stroke-width="8"/><!--black--> <circle cx="295" cy="65" r="50" fill="none" stroke="#DE1818" stroke-width="8"/><!--red--> <circle cx="125" cy="110" r="50" fill="none" stroke="#FFEF08" stroke-width="8"/><!--yellow--> <circle cx="240" cy="110" r="50" fill="none" stroke="#087B39" stroke-width="8"/><!--green--> <text x="180" y="210" font-family="Verdana" font-size="40" fill="silver" text-anchor="middle">Rio 2016</text> </svg> <script type="text/javascript"> //Load in contents of CSV file d3.csv("neet_def_gdp.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>
Modified
http://d3js.org/d3.v3.js
to a secure url
https://d3js.org/d3.v3.js