xxxxxxxxxx<html lang="en"> <head> <meta charset="utf-8"> <title>Loading CSV Data with D3</title> <script type="text/javascript" src="https://d3js.org/d3.v3.js"></script> </head> <body> <svg width="600" height="200"> <text x="0" y="50" fill="charcoal" font-size="42" font-weight="bold" font-family="Helvetica">New Jersey Crime Analysis</text> <ellipse cx="240" cy="100" rx="220" ry="30" style="fill:none;stroke:black" /> <clipPath id="cut-off-right"> <rect x="0" y="0" width="175" height="200" /> </clipPath> <ellipse cx="240" cy="100" rx="220" ry="30" style="fill:red" clip-path="url(#cut-off-right)" /> <clipPath id="cut-off-left"> <rect x="300" y="0" width="175" height="200" /> </clipPath> <ellipse cx="240" cy="100" rx="220" ry="30" style="fill:blue" clip-path="url(#cut-off-left)" /> <clipPath id="cut-off-back"> <rect x="0" y="100" width="460" height="100" /> </clipPath> <ellipse cx="240" cy="100" rx="220" ry="10" style="fill:none;stroke:black" clip-path="url(#cut-off-back)" /> <text x="217" y="102" fill="black" font-size="32" font-weight="none" font-family="Impact" style="stroke:navy;stroke-width:1">FBI</text> </svg> <script type="text/javascript"> //Load in contents of CSV file d3.csv("New Jersey Crime.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