xxxxxxxxxx<html lang="en"> <head> <meta charset="utf-8"> <title>Loading My CSV Data with D3</title> <script type="text/javascript" src="https://d3js.org/d3.v3.js"></script> <style type="text/css"> body { background-color: white; } svg { background-color: grey; border-style: solid; border-width: 3px; border-color: black; } </style> </head> <body> <p>Something Exciting Coming Soon!</p> <script type="text/javascript"> //Load in contents of CSV file d3.csv("DanielleW_HDR2014.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="600" height="600"> <rect x="50" y="50" width="70" height="400" fill="red" /> <rect x="150" y="75" width="50" height="450" fill="blue" /> <circle cx="100" cy="325" r="75" fill="green" fill-opacity="50%" /> <rect x="220" y="100" width="30" height="300" fill="orange" /> <rect x="260" y="125" width="15" height="400" fill="green" /> <circle cx="350" cy="250" r="50" fill="violet" /> <rect x="280" y="150" width="40" height="40" fill="black" /> <rect x="280" y="200" width="40" height="40" fill="white" fill-opacity="50%" /> <rect x="280" y="250" width="40" height="40" fill="black" fill-opacity="50%" /> <rect x="280" y="300" width="40" height="40" fill="black" /> <line x1="375" y1="250" x2="500" y2="375" stroke="red" stroke-width="3" /> <text x="208" y="95" fill="charcoal" font-size="22" font-weight="bold" font-family="Helvetica">Linking Human Development</text> <text x="325" y="125" fill="charcoal" font-size="22" font-weight="bold" font-family="Helvetica">& Internet Access</text> </svg> </body></html> Modified http://d3js.org/d3.v3.js to a secure url
https://d3js.org/d3.v3.js