D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
devdiva8
Full window
Github gist
Mod 2 Exercise- SVG and view console data
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Loading CSV Data with D3</title> <script type="text/javascript" src="https://d3js.org/d3.v3.js"></script> <style type="text/css"> body {font-family:Arial;color:darkslateblue} </style> </head> <body> <h1>Module 2 Exercise: SVG and View CSV data on Console</h1> <div id="svg" > <svg width="300" height="300"> <circle cx="50%" cy="50%" r="100" stroke="green" stroke-width="4" fill="yellow" /> <circle cx="43%" cy="43%" r="10" fill="black"></circle> <circle cx="55%" cy="45%" r="10" fill="black"></circle> <path d="M120,170 A30,30 0 0,0 170,170" stroke="#333" stroke-width="5" fill="none"/> </svg> </div> <p>Not much to see here; try looking in the console for Education score data.</p> <script type="text/javascript"> //Load in contents of CSV file d3.csv("gr4gr8_math.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