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

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. 深入理解 Javascript 面向对象编程(转)

    一:理解构造函数原型(prototype)机制 prototype是javascript实现与管理继承的一种机制,也是面向对象的设计思想.构造函数的原型存储着引用对象的一个指针,该指针指向与一个原型对 ...

  2. SQL语言学习-数据定义语言

    Sql语言至今已经有6个版本.SQL查询语言包括了所有对数据的操作命令,这些操作可分为四类:数据定义语言(DDL).数据操纵语言(DML).数据控制语言(DCL)和嵌入式SQL语言. 数据定义语言(D ...

  3. delete大批量数据引起空间爆满处理

    前一天晚上做大表删除操作测试,分段删除,没删除100000条commit一次,由于存储过程打印了执行时间中途断网,无法看到执行时间于是直接kill了任务结果早上登录测试数据库发现空间爆满然后一时糊涂去 ...

  4. linux 链接控制

    如发现系统存在大量TIME_WAIT状态的连接,通过调整内核参数解决,vim /etc/sysctl.conf编辑文件,加入以下内容:net.ipv4.tcp_syncookies = 1net.ip ...

  5. c++线程创建传递的参数发生改变

    看看如下代码,觉得输出会是什么? #include "stdafx.h" #include <windows.h> #include <iostream> ...

  6. [Tree]Binary Tree Inorder Traversal

    Total Accepted: 98729 Total Submissions: 261539 Difficulty: Medium Given a binary tree, return the i ...

  7. Vijos 1121 马拦过河卒

    首先要看清题目,卒只能向右或者向下走.而不是四周转.这样的话就无解了. 定义f[i][j],表示走到(i,j)这个点时的总步数.这样就写出了一个递推公式f[i][j]=f[i-1]+f[i][j-1] ...

  8. slice,substr,substring

    var s = '0123456789';   //slice 遇负数,则此负数值等同于 s.length + (负数) s.slice(3,6); //"345", 从位置3开始 ...

  9. Looper、Hander、HandlerThread

    一.Message .Looper.Handler之间的关系 1.系统发送的Message消息传送给Handler,Handler将Message放入自己的looper队列的底部   然后再从Loop ...

  10. 网络解析 get 和post

    //get同步 - (IBAction)getT:(id)sender { //准备一个Url NSURL *url=[NSURL URLWithString:BASE_URL]; //创建一个请求对 ...