提取 ECharts 中的svg地图信息
地图的需求还是蛮大的,全国都要自己画的话,还是需要投入比较大的人力。
ECharts中有地图,那我们能不能把里面的地图文件提取出来呢,主要逻辑在map.js中。
看源代码发现,ECharts中地图信息,通过算法,把坐标信息,转换成基准[x,y]和坐标数组,再通过String.fromCharCode坐标数组转换成字符(),进行存储
这也是一种大量数字数据,前端压缩,编码的好办法。
ECharts的使用的这种方式,灵活性更高,可以修改图像的偏移,放大倍数。
而在项目中,使用的方式,可以通过viewBox完成,但是图像偏移就没有简便方法实现了
代码大部分都是ECharts内部代码,把用到的整理出来,通过raphael把地图显示出来,地址戳这里。
上个效果图

提取 ECharts 中的svg地图信息的更多相关文章
- HTML中的SVG
HTML5中的SVG是Scalable Vector Graphic的简称,是一种用来绘制矢量图的HTML5标签,由万维网联盟定制,是一个基于可扩展标记语言,用于绘制二维可缩放矢量图形. 是一种使用X ...
- HTML5中使用SVG
SVG 即 Scalable Vector Graphics,是一种用来绘制矢量图的 HTML5 标签.你只需定义好XML属性,就能获得一致的图像元素. 使用SVG之前先将标签加入到HTML body ...
- 【前端】提取URL中的各个GET参数
/**************************** * 有这样一个URL:http://item.taobao.com/item.htm?a=1&b=2&c=&d=xx ...
- HTML5中的SVG
* SVG * 基本内容 * SVG并不属于HTML5专有内容 * HTML5提供有关SVG原生的内容 * 在HTML5出现之前,就有SVG内容 * SVG,简单来说就是矢量图 * SVG文件的扩展名 ...
- C++ 提取字符串中的数字
C++ 提取字符串中的数字 #include <iostream> using namespace std; int main() { ] = "1ab2cd3ef45g&quo ...
- ECharts SSH+JQueryAjax+Json+JSP将数据库中数据填充到ECharts中
本文引用自:http://blog.csdn.net/ArcticFoxHan/article/details/38071641 1.导入包,搭建SSH框架 导入Jquery的JS包,<sc ...
- 在线提取PDF中图片和文字
无需下载软件,你就可以在线提取PDF中图片和文字,http://www.extractpdf.com/不仅可以获取本地PDF文档的图片和文字,还能获取远程PDF文档的图片和文字.如下图所示:结果本人测 ...
- python笔记之提取网页中的超链接
python笔记之提取网页中的超链接 对于提取网页中的超链接,先把网页内容读取出来,然后用beautifulsoup来解析是比较方便的.但是我发现一个问题,如果直接提取a标签的href,就会包含jav ...
- html5 中的SVG 和canvas
想到昨天看资料的时候,发现html5 中的SVG 和canvas 都可以表示图形,那它们到底有哪些区别呢?该如何正确的使用它们呢? 1.SVG:可缩放矢量图形,(Scalable Vector Gra ...
随机推荐
- 深入理解 Javascript 面向对象编程(转)
一:理解构造函数原型(prototype)机制 prototype是javascript实现与管理继承的一种机制,也是面向对象的设计思想.构造函数的原型存储着引用对象的一个指针,该指针指向与一个原型对 ...
- SQL语言学习-数据定义语言
Sql语言至今已经有6个版本.SQL查询语言包括了所有对数据的操作命令,这些操作可分为四类:数据定义语言(DDL).数据操纵语言(DML).数据控制语言(DCL)和嵌入式SQL语言. 数据定义语言(D ...
- delete大批量数据引起空间爆满处理
前一天晚上做大表删除操作测试,分段删除,没删除100000条commit一次,由于存储过程打印了执行时间中途断网,无法看到执行时间于是直接kill了任务结果早上登录测试数据库发现空间爆满然后一时糊涂去 ...
- linux 链接控制
如发现系统存在大量TIME_WAIT状态的连接,通过调整内核参数解决,vim /etc/sysctl.conf编辑文件,加入以下内容:net.ipv4.tcp_syncookies = 1net.ip ...
- c++线程创建传递的参数发生改变
看看如下代码,觉得输出会是什么? #include "stdafx.h" #include <windows.h> #include <iostream> ...
- [Tree]Binary Tree Inorder Traversal
Total Accepted: 98729 Total Submissions: 261539 Difficulty: Medium Given a binary tree, return the i ...
- Vijos 1121 马拦过河卒
首先要看清题目,卒只能向右或者向下走.而不是四周转.这样的话就无解了. 定义f[i][j],表示走到(i,j)这个点时的总步数.这样就写出了一个递推公式f[i][j]=f[i-1]+f[i][j-1] ...
- slice,substr,substring
var s = '0123456789'; //slice 遇负数,则此负数值等同于 s.length + (负数) s.slice(3,6); //"345", 从位置3开始 ...
- Looper、Hander、HandlerThread
一.Message .Looper.Handler之间的关系 1.系统发送的Message消息传送给Handler,Handler将Message放入自己的looper队列的底部 然后再从Loop ...
- 网络解析 get 和post
//get同步 - (IBAction)getT:(id)sender { //准备一个Url NSURL *url=[NSURL URLWithString:BASE_URL]; //创建一个请求对 ...