1 Star 1 Fork 0

邹先生 / svg2geojson转换器备份

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
ISC

svg 转 geojson(gulp 插件)


[TOC]

使用方法

1.下载

git clone https://github.com/yuhonyon/svg2geojson.git

2.安装

cd geojson
cnpm i

3.使用

  • 将 svg 文件直接放在 ** svg/ ** 目录下
  • 输入命令
gulp
  • 在 ** dist/ ** 目录下将生产对应的目录,目录下有转换后的 geojson 文件以及行政中心的坐标文件和 svg 原文件

制作地图 geojson 数据的所有步骤

  • 设计地图草稿
  • 根据设计稿使用 ai 画矢量地图
  • 导出 svg
  • 使用 gulp 将 svg 转换为 geojson
  • 使用图表库制作地图

设计地图草稿

设计师设计地图草稿(只需明确行政划分区域即可),如下图

使用 AI 描出矢量图

  • 将设计草稿导入 AI
  • 新建图层,在图层内跟据设计稿使用钢笔工具描出一个行政区的行政(使用多边形描边)
  • 将该图层取名为行政区名字
  • 重复第 2 步,描出所有行政区

  • 选择所有描点,转换尖角,去除不小心画出的曲线(导出的 svg 不是由 polygon 组成的而是 path 的时候使用这个方法,建议描完后就使用一次)

  • 在每个图层中心处再画一个圆形或者椭圆

  • 删除设计草稿的图层导出 svg,没有出错的话格式应该如下

  • 如果发现 poluygon 标签变成了 path,请注意第 4 步骤

** 注意:导出的 svg 转换出的 geojson 制作的地图将会是垂直颠倒的(可能是坐标轴不一样, 一个左上角一个右下角),所以我们要把我们制作的 AI 图垂直翻转后再导出 svg **

将 svg 转换为 geojson

实例

echarts (echarts 会将地图横向压扁,需要设置宽高,不能自适应)

<iframe width="100%" height="300" src="http://jsrun.net/iNpKp/embedded/all/light/" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

highcharts

<iframe width="100%" height="300" src="http://jsrun.cn/ZNpKp/result/light/" frameborder="0" ></iframe>
ISC License: Copyright (c) 2004-2010 by Internet Systems Consortium, Inc. ("ISC") Copyright (c) 1995-2003 by Internet Software Consortium Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies. THE SOFTWARE IS PROVIDED "AS IS" AND ISC DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL ISC BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

简介

svg 转 geojson(gulp 插件) 展开 收起
ISC
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
1
https://gitee.com/xccjh/svg2geojson_converter_backup.git
git@gitee.com:xccjh/svg2geojson_converter_backup.git
xccjh
svg2geojson_converter_backup
svg2geojson转换器备份
master

搜索帮助