【 D3.js 入门系列 — 10.1 】 简化 GeoJSON 文件

GeoJSON 文件有时候太大,读取颇费时间。如果我们不需要那么精确,可将其简化。

入门 – 第 10 章】制作中国地图时用到了 GeoJSON 文件。后来我发现这个文件太大,有 2,364 KB,读取要花很长时间。虽然能保证精确性,但通常不需要那么精确的边界,所以有必要将其简化。所幸已经有前人做过这项工作,真可谓前人栽树,后人乘凉,在这里表示感谢。

转换方法:

1. 打开网站

http://mapshaper.org/

2. 选择文件

点击 select 选择要缩小的 GeoJSON 文件。
1015

3. 缩小比例

点击右上角的 Simplify,弹出以下对话框。在这里可以选择简化的方法。

1016

一般来说,选择默认的即可,单击 Next。

原始图:

1017

简化到 14%:

1018

 

4. 输出模式

点击右上角的 Export,弹出对话框。可以选择输出的文件格式。

1019

点击 GeoJSON 即可自动下载。

5. 结果

入门 – 第 10 章】的 china.geojson 文件大小为 250KB,简化后的文件

简化后为: china_s.geojson ,大小为 44.2 KB,你还可以继续简化。

结果请点击:http://www.ourd3js.com/demo/rm/R-10.1/chinamap.html

读取速度快了不少吧。

文档信息

【 D3.js 入门系列 — 10.1 】 简化 GeoJSON 文件》上有7条评论

  1. 老师:你好!
    咨询一下,怎么实现一个颜色在曲线上动起来,从一个坐标轴的点循环运动到另一个坐标轴?
    现在曲线已经画好了,坐标轴的点也能够运动到设置的终点坐标,就是没有按照画出的轨迹去走, 是以直线的效果呈现,我想要的效果是按照原来画出的曲线轨迹运动下去,现在不知道怎么获取曲线轨迹?

    • 谢谢。
      这个下载需要积分,我的CSDN连1积分也没有/(ㄒoㄒ)/~~
      能麻烦你下载一下,用邮箱传给我吗?
      tanlangx#126.com

  2. 工作中多从csv中导入数据。因此希望博主能介绍一下将从csv导入的数据转化为json为方法。我用过d3的nest方法,但还不是很了解。谢谢!

  3. 博主会介绍topojson和geojson的关系吗?比如什么情况下用哪个比较合适

评论已关闭。