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

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. 《think in python》学习-9

    think in python think in python -9 案例分析:文字游戏 从文本文件中读取文字 作者提供了一个文本文件words.txt 地址 本章后面案例也会用带该文件中的词组 fi ...

  2. Mac下Mysql启动异常["ERROR 2002 (HY000): Can't connect to local MySQL server through socket '/tmp/mysql.sock' (2)"]

    在mac下使用brew安装mysql,之前没有使用过,今天启动的时候发现启动不了 huijundeMacBook-Pro:bin huijunzhang$ mysql ERROR (HY000): C ...

  3. [ZT]图像处理库的比较:OpenCV,FreeImage,CImg,CxImage

    1.对OpenCV 的印象:功能十分的强大,而且支持目前先进的图像处理技术,体系十分完善,操作手册很详细,手册首先给大家补计算机视觉的知识,几乎涵盖了近10年内的主流算法: 然后将图像格式和矩阵运算, ...

  4. gridView行号的显示

    我们在进行开发的时候,很多地方希望dataGridview或girdView显示行号,这里我来说一下两种的实现方法 在girdView中很简单很好实现,我在这里写一下代码,具体其他功能可以看其带的DE ...

  5. virtualBox 安装CentOS 全屏

    在VirtualBox里安装CentOS系统,会遇到“增强工具”无法正常安装,主要的原因是出在Kernel 库找不到. 错误提示如下: 通过查看日志文件: cat /var/log/vboxadd-i ...

  6. android 连接网络的简单实例

    1.android有两种连接网络的类HttpURLConnect和HttpClient,但是HttpClient已逐渐被HttpURLConnect类代替所以就不提及. 2.实例 String add ...

  7. AWS之EC2远程登录

    网上有丰富的免费资源,Amazon的云主机就是开发者和学习者很好的选择. 但你得有一张信用卡,注册个AWS(Amazon web service)账号,就可以有自己公网ip的服务器了!!! 最近在折腾 ...

  8. js自定义类和对象及继承

    1.工厂方式 <script type="text/javascript"> function createObject(name){ var p = new Obje ...

  9. STM32与LPC系列ARM资源之比较

    由于有周立公开发板的影响,LPC系列的开发板在工程师心目中一般是入门的最好型号之一.这次刚好有STM32的竞赛,正好将两者的资源进行比较一下(LPC系列以LPC213X为例). LPC213X包括LP ...

  10. android 自定义ViewGroup和对view进行切图动画实现滑动菜单SlidingMenu[转]

    http://blog.csdn.net/jj120522/article/details/8095852 示意图就不展示了,和上一节的一样,滑动菜单SlidingMenu效果如何大家都比较熟悉,在这 ...