下载 GIS 源码
GADM 是管理 GIS 文件的完美来源。
GADM.org > Download page ：选择您的国家并格式化“shapefile” > 好的。
或通过终端（将新加纳代码GHA 替换为您的目标国家/地区的iso 代码）：
# prepare folder
mkdir -p ./map; cd ./map
curl http://d3js.org/d3.v3.min.js -O -J
curl http://d3js.org/topojson.v1.min.js -O -J
# download data
curl \
-L -C - 'http://biogeo.ucdavis.edu/data/gadm2/shp/GHA_adm.zip' \
-o ./GHA_adm.zip
unzip -n ./GHA_adm.zip -d ./
shp 到 topojson
使用topojson command line，更直接。如果您想保留所有属性：
topojson -q 1e4 \
-o out.json \
-- in1.shp in2.shp
您还可以从 shapfiles 中选择属性，然后随时重命名它们：
topojson \
--bbox \
--id-property none \
-p name=NAME_1 \
-p code=ID_1 \
-p L0=NAME_0 \
-q 1e4 \
--filter=small \
-o GHA_adm_w.topo.json \
-- admin_1=GHA_adm1.shp admin_2=GHA_adm2.shp
对于 GHA，.shp 中没有适合良好 ID 的属性。 NAME_1 有空格，这将在您的 HTML 中给出无效的 id。
检查json
使用 http://jsoneditoronline.org 。检查您的 json 将为您提供 what 数据可用以及 where（点符号路径）的线索。 topojson distillery 帮助预览任何 topojson 以及代码是否正确。
D3js 调用
<!DOCTYPE html>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style>
.L1 {
fill: #E0E0E0;
stroke: #FFF;
stroke-width:1px;
}
</style>
<body>
<script src="./d3.v3.min.js"></script>
<script src="./topojson.v1.min.js"></script>
<script>
var mapIt = function(width, url){
console.log("mapIt(): start");
var height = width/960*500;
var svg = d3.select('body').append('svg')
.attr('width', width)
.attr('height', height);
var projection = d3.geo.mercator()
.scale(1)
.translate([0, 0]);
var path = d3.geo.path()
.projection(projection);
d3.json(url, function (error, json) {
var admin_1 = topojson.feature(json, json.objects.admin_1);
/* Autofocus code comes here ! */
svg.selectAll("path")
.data(admin_1.features)
.enter().append("path")
.attr('d', path)
.attr('class', 'L1');
});
};
mapIt(960,"http://somesite.org/data/NZL_adm.topo.json");
</script>
</body>
</html>
专注
正确的自动对焦需要来自Mike Bostocks 的一小段代码，例如here：
// Compute the bounds of a feature of interest, then derive scale & translate.
var b = path.bounds(admin_1),
s = .95 / Math.max((b[1][0] - b[0][0]) / width, (b[1][1] - b[0][1]) / height),
t = [(width - s * (b[1][0] + b[0][0])) / 2, (height - s * (b[1][1] + b[0][1])) / 2];
// Update the projection to use computed scale & translate.
projection
.scale(s)
.translate(t);
编辑：现在应该可以工作了。现场演示：bl.ocks.org