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

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》学习-7

    think in python 7 迭代 对一个变量可以进行多次赋值 是合法的. 例如以下: bruce = 5 print bruce bruce = 7 print bruce 因为有了多重赋值 ...

  2. LevelDB.NET性能测试

    最近了解了一下LevelDB,发觉这个嵌入式的K-V数据性能不错,所以顺便想在使用层面了解一下.由于LevelDB也有针对.net的实现,所以就针对了LevelDB.NET进行了一个简单的读写压力测试 ...

  3. SQL高级查询的练习题

    Student(S#,Sname,Sage,Ssex) 学生表 Course(C#,Cname,T#) 课程表 SC(S#,C#,score) 成绩表 Teacher(T#,Tname) 教师表 问题 ...

  4. C++中内存分配详解

    转载自51CTO.com           http://developer.51cto.com/art/201107/276154.htm 我们都知道,内存基本上分为静态存储区.堆区和栈区三大部分 ...

  5. 解决Linux文档显示中文乱码问题以及编码转换

    解决Linux文档显示中文乱码问题以及编码转换 解决Linux文档显示中文乱码问题以及编码转换 使vi支持GBK编码 由于Windows下默认编码是GBK,而linux下的默认编码是UTF-8,所以打 ...

  6. ecshop使用Google API及OAuth2.0登录授权(PHP)

    一.申请clientID https://console.developers.google.com/project 二.开启Google+ API权限 https://console.develop ...

  7. sql server 2008 索引

    微软的SQL SERVER提供了两种索引:聚集索引(clustered index,也称聚类索引.簇集索引)和非聚集索引(nonclustered index,也称非聚类索引.非簇集索引) 我们举例来 ...

  8. 论山寨手机与Android联姻 【3】手机是怎样生产出来的

    要说清楚MTK在商业模式上有什么优势,以及Android对于MTK未来的手机开发会有什么影响,首先得了解手机从设计,开发到生产的整个过程.让我们先来看看手机的生产过程.在生产制造环节,山寨手机和正牌手 ...

  9. 快学Scala习题解答—第一章 基础

    1 简介 近期对Scala比较感兴趣,买了本<快学Scala>,感觉不错.比<Programming Scala:Tackle Multi-Core Complexity on th ...

  10. #include <stdbool.h>

    可以使用bool和true.false 输出是1或者0 #define _CRT_SECURE_NO_WARNINGS #include<stdio.h> #include<stdb ...