Skip to content

Instantly share code, notes, and snippets.

@cornchz

cornchz/README.md

Created April 18, 2013 01:00
Show Gist options
  • Save cornchz/5409044 to your computer and use it in GitHub Desktop.
Save cornchz/5409044 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
README.md

Description

  • Level: Provinces (시도)
  • Data format: TopoJSON
  • Data source: GADM

The data download script can be found here.

Author

Lucy Park, Team POPONG

Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
.province {
fill: #eee;
stroke: #999;
}
text {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 10px;
text-anchor: middle;
}
</style>
</head>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/topojson.v0.min.js"></script>
<script>
var w = 800, h = 800;
var proj = d3.geo.mercator()
.center([128.0, 35.9])
.scale(6500)
.translate([w/2, h/2]);
var path = d3.geo.path().projection(proj);
var svg = d3.select("body").append("svg")
.attr("width", w)
.attr("height", h);
d3.json("skorea-provinces-topo.json", function(error, kor) {
var provinces = topojson.object(kor, kor.objects['skorea-provinces-geo']);
svg.append("path")
.datum(provinces)
.attr("class", "province")
.attr("d", path);
svg.selectAll("text")
.data(provinces.geometries)
.enter().append("text")
.attr("transform", function(d) { return "translate(" + path.centroid(d) + ")"; })
.attr("dy", ".35em")
.text(function(d) { return d.properties.NAME_1; });
});
</script>
</body>
</html>
Display the source blob
Display the rendered blob
Raw
skorea-provinces-topo.json
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment