地图的需求还是蛮大的，全国都要自己画的话，还是需要投入比较大的人力。

ECharts中有地图，那我们能不能把里面的地图文件提取出来呢，主要逻辑在map.js中。

看源代码发现，ECharts中地图信息，通过算法，把坐标信息，转换成基准[x,y]和坐标数组，再通过String.fromCharCode坐标数组转换成字符()，进行存储

这也是一种大量数字数据，前端压缩，编码的好办法。

ECharts的使用的这种方式，灵活性更高，可以修改图像的偏移，放大倍数。

而在项目中，使用的方式，可以通过viewBox完成，但是图像偏移就没有简便方法实现了

　　代码大部分都是ECharts内部代码，把用到的整理出来，通过raphael把地图显示出来，地址戳这里。

　　上个效果图

　　

提取 ECharts 中的svg地图信息的更多相关文章

  1. HTML中的SVG

    HTML5中的SVG是Scalable Vector Graphic的简称,是一种用来绘制矢量图的HTML5标签,由万维网联盟定制,是一个基于可扩展标记语言,用于绘制二维可缩放矢量图形. 是一种使用X ...

  2. HTML5中使用SVG

    SVG 即 Scalable Vector Graphics,是一种用来绘制矢量图的 HTML5 标签.你只需定义好XML属性,就能获得一致的图像元素. 使用SVG之前先将标签加入到HTML body ...

  3. 【前端】提取URL中的各个GET参数

    /**************************** * 有这样一个URL:http://item.taobao.com/item.htm?a=1&b=2&c=&d=xx ...

  4. HTML5中的SVG

    * SVG * 基本内容 * SVG并不属于HTML5专有内容 * HTML5提供有关SVG原生的内容 * 在HTML5出现之前,就有SVG内容 * SVG,简单来说就是矢量图 * SVG文件的扩展名 ...

  5. C++ 提取字符串中的数字

    C++ 提取字符串中的数字 #include <iostream> using namespace std; int main() { ] = "1ab2cd3ef45g&quo ...

  6. ECharts SSH+JQueryAjax+Json+JSP将数据库中数据填充到ECharts中

    本文引用自:http://blog.csdn.net/ArcticFoxHan/article/details/38071641   1.导入包,搭建SSH框架 导入Jquery的JS包,<sc ...

  7. 在线提取PDF中图片和文字

    无需下载软件,你就可以在线提取PDF中图片和文字,http://www.extractpdf.com/不仅可以获取本地PDF文档的图片和文字,还能获取远程PDF文档的图片和文字.如下图所示:结果本人测 ...

  8. python笔记之提取网页中的超链接

    python笔记之提取网页中的超链接 对于提取网页中的超链接,先把网页内容读取出来,然后用beautifulsoup来解析是比较方便的.但是我发现一个问题,如果直接提取a标签的href,就会包含jav ...

  9. html5 中的SVG 和canvas

    想到昨天看资料的时候,发现html5 中的SVG 和canvas 都可以表示图形,那它们到底有哪些区别呢?该如何正确的使用它们呢? 1.SVG:可缩放矢量图形,(Scalable Vector Gra ...

随机推荐

  1. 献给写作者的 Markdown 新手指南

    「简书」作为一款「写作软件」在诞生之初就支持了 Markdown,Markdown 是一种「电子邮件」风格的「标记语言」,我们强烈推荐所有写作者学习和掌握该语言.为什么?可以参考: 『为什么作家应该用 ...

  2. 工厂类分离与java反射机制

    网易 博客 发现 小组 风格 手机博客 玩LOFTER,免费冲印20张照片!> 创建博客登录  加关注 黙言-在路上 奋斗 首页 日志 相册 音乐 收藏 博友 关于我             黙 ...

  3. dom操作例子

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  4. java之方法覆盖的坑

    昨天写了个小例子,覆盖hashCode.equals进行集合set的一些特性测试,代码如下: class Test3 { public int c; public Test3(int c) {this ...

  5. C++命名准则

    总则:命名用英语,单词简单,明了.意义明确.过长的单词可以使用省略.一般是去掉元音字母形成省略.如果有通用的缩写,应该采用通用的缩写. 1.函数命名 1.1:全局函数:采用限定词+动词(+名词的原则) ...

  6. Fedora 开启 ssh

    Fedora 17 已经安装好openssh server了 不用再装 不过默认无开启 首先su root1.开启ssh服务# systemctl start sshd.service 2.随系统一起 ...

  7. Web页面在手机上显示过大问题

    网上抄来了,自己也备忘下:增加<meta name="viewport" content="width=device-width, initial-scale=1. ...

  8. ACID:数据库事务正确执行的四个基本要素

    ACID,指数据库事务正确执行的四个基本要素的缩写.包含:原子性(Atomicity).一致性(Consistency).隔离性(Isolation).持久性(Durability).一个支持事务(T ...

  9. redBag

    var redBag = (function () { var initialed = false, raining = true, createInterval, walkInterval, cre ...

  10. Linux下去掉Windows文件的^M

    Windows下文件换行符为\r\n  而Linux下文件的换行为\n 因此在Linux下可以使用vim编辑文件  使用全文替换命令 :%s/\r//g 将\r全部替换掉 也可以在Linux使用dos ...