Skip to content

Instantly share code, notes, and snippets.

@eoiny
Created March 26, 2012 22:11
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 5 You must be signed in to fork a gist
  • Save eoiny/2210150 to your computer and use it in GitHub Desktop.
Save eoiny/2210150 to your computer and use it in GitHub Desktop.
D3 Choropleth Map Ireland
<!DOCTYPE html>
<html>
<head>
<title>Map</title>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js"></script>
<style type="text/css">
svg {
background: #eee;
}
#ireland {
fill: #008000;
opacity: .8;
stroke: #000000;
stroke-width: .7;
}
</style>
</head>
<body>
<!--<h1 id='calendar_view'>Calendar View</h1>-->
<div class='gallery' id='chart'> </div>
<link href='calendar.css' rel='stylesheet' type='text/css' />
<link href='colorbrewer.css' rel='stylesheet' type='text/css' />
<script type="text/javascript">
var w = 600;
var h = 600;
var proj = d3.geo.mercator();
var path = d3.geo.path().projection(proj);
var t = proj.translate(); // the projection's default translation
var s = proj.scale() // the projection's default scale
var map = d3.select("#chart").append("svg:svg")
.attr("width", w)
.attr("height", h)
// .call(d3.behavior.zoom().on("zoom", redraw))
.call(initialize);
var ireland = map.append("svg:g")
.attr("id", "ireland");
d3.json("ireland.json", function (json) {
ireland.selectAll("path")
.data(json.features)
.enter().append("path")
.attr("d", path);
});
function initialize() {
proj.scale(1200);
//proj.translate([-1240, 720]);
}
</script>
</body>
</html>
Display the source blob
Display the rendered blob
Raw
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment