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

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. sticker.js贴纸效果

    http://stickerjs.cmiscm.com/ <div class="sticker gbtags"></div> <!-- 引用Java ...

  2. （三）Android中Intent概念及应用

    一.显示Intent startActivity(new Intent(MainActivity.this,BAty.class)); 显示Intent直接指定要启动的Intent类 注意自己通过创建 ...

  3. 在ASP.NET MVC自定义错误页面

    异常处理跳转页面 第一步,在项目的Web.config文件中找到节点<system.web> 在此节点下添加配置(Error为定义的控制器也可以多添加些error标签用于区分不同的错误) ...

  4. java之集合类特性对比分析列表

    类集合框架有很多文章都列出了继承关系图,但是我没有找到更清晰的特性对比图,我这里根据使用选择条件总结对比罗列一下它们之间的一些特点.

  5. hibernate中先建表还是先建实体类

    在实际工作中往往是先建表然后再生成类原因:建好数据库表之后往往要对数据表进行一些优化,比如说建索引,比如说建中间表,比如建视图.如果先建类的话这些优化是无法生成的

  6. 您在基于 Windows 7 的或基于 Windows Server 2008 R2 的计算机上读取器中插入智能卡时出现错误消息："设备驱动程序软件未能成功安装"

    http://support.microsoft.com/kb/976832/zh-cn http://support.microsoft.com/kb/976832/zh-tw 症状 当智能卡插入智 ...

  7. .Net缓存

    近期研究了一下.Net的缓存,据说可以提高系统的性能. .Net缓存分为两种HttpRuntime.Cache和HttpContext.Current.Cache 不过从网上查找资料,说两种缓存其实是 ...

  8. CC++初学者编程教程(14) Redhat linux安装Oracle12c

    1选择虚拟机的设置 2 设置共享文件夹 3 使用共享文件夹向导 4 选择主机路径 5 启用文件共享 6 设置好文件共享以后,关闭虚拟机的设置 7 开启虚拟机 8 登陆 9输入密码 10 安装vmwar ...

  9. Linux oracle 11g r2 安装前检查及安装

    Linux环境配置 [c-sharp] view plaincopy OS:Fedora 15 DB:Oracle 11gR2 将Oracle安装到home/oracle_11目录 配置过程:本文来自 ...

  10. libc++abi.dylib handler threw exception

    在iOS开发时,有时候遇到libc++abi.dylib handler threw exception这样的异常,  虽然在断点出加上了All Exceptions,也断到相应的代码了,但是没打印对 ...