ecl*_*ark 12 shapefile gdal geojson d3.js topojson
我想墨西哥城市的shape文件转换成topojson和使用d3.js使用本教程中显示它http://bost.ocks.org/mike/map/#converting-data.我设法转换它但我无法显示它.任何帮助将不胜感激.
这是我目前的工作流程:
1)下载并解压缩shapefile
wget http://mapserver.inegi.org.mx/MGN/mgm2010v5_0a.zip
unzip mgm2010v5_0a.zip
Run Code Online (Sandbox Code Playgroud)
2)转换为JSON,重新投影到lat-long并对shapefile进行子集化
ogr2ogr -f GeoJSON -t_srs EPSG:4326 -where "CVE_ENT IN ('09')" df.json Municipios_2010_5A.shp
Run Code Online (Sandbox Code Playgroud)
3)转换为topojson
topojson --id-property OID -p name=OID -p name -o df2.json df.json
Run Code Online (Sandbox Code Playgroud)
4)并创建HTML代码
<!DOCTYPE html>
<meta charset="utf-8">
<style>
/* CSS goes here. */
</style>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/topojson.v1.min.js"></script>
<script>
var width = 960,
height = 1160;
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
d3.json("df2.json", function(error, df2) {
svg.append("path")
.datum(topojson.feature(df2, df2.objects.df))
.attr("d", d3.geo.path().projection(d3.geo.mercator()));
});
</script>
Run Code Online (Sandbox Code Playgroud)
如果我运行html我只是得到一个空白页面.关于我可能做错什么的任何想法?
mbo*_*ock 24
如果您不特别关注投影,最简单的选择是使用shapefile(Lambert Conformal Conic)提供的投影.使用topojson的--width和--height命令行标志将投影的shapefile重新调整为合理的大小.例如,如果你想要960px宽的东西,你可以说:
topojson --width=960 --margin 20 --simplify=.1 -o mx.json -- municipalities.shp
Run Code Online (Sandbox Code Playgroud)
(这也方便地简化了屏幕坐标.)
使用Makefile的完整示例位于bl.ocks.org/9265467:
另一方面,如果要指定自己的投影,则使用ogr2ogr撤消投影,然后在浏览器中定义投影是合理的.但在这种情况下,您需要适当地指定投影参数.例如,要在浏览器中重新创建相同的投影,您可以说:
var projection = d3.geo.conicConformal()
.rotate([102, 0])
.center([0, 24])
.parallels([17.5, 29.5])
.scale(1850)
.translate([width / 2, height / 2]);
Run Code Online (Sandbox Code Playgroud)
(根据您的喜好调整中心和比例以适合您想要的视口.)这种替代方法在bl.ocks.org/9265674中进行了演示:
我通常更喜欢使用投影坐标(上面的第一种方法),因为渲染速度更快,简化更有效.另一方面,如果你想动态地改变投影 - 不可能这么复杂的shapefile - 那么在浏览器中进行投影是可行的方法.在开发过程中在浏览器中进行投影很好,因为更容易更改参数和重新加载.
| 归档时间: |
|
| 查看次数: |
2265 次 |
| 最近记录: |