Echarts地图使用经验-地图变形和添加数据
关于echart2,echart3地图的使用一点人生经验:
1.echart3,echart2加载地图变形修复。
最近在使用echart2使用过程中,发现加载海南地图会产生变形。如下图,海南地图产生了较大的变形,于是需要研究怎么才能消除变形。经过一番折腾,修改echart-all.js中_getTransform函数的
varxScale = width /mapWidth;
varyScale = height / mapHeight;
console.log(rate);
if(xScale > yScale) {
//xScale = yScale * rate;
xScale = yScale;
width = mapWidth * xScale;
}else{
yScale = xScale;
//xScale = yScale * rate;
height = mapHeight * yScale;
}
这样地图就能不产生变形(echart3里添加这个aspectScale:1就能使地图不变形)
2.echart2中添加自定义geosjon(主要讲的是echart2,echart3里加载geojson已经比较方便)
同样是修改echart-all.js中代码加入如下代码,就能使用mapType为'hainan'的地图
'hainan': {getGeoJson: (function() {
return function(callback) {$.getJSON('data/hn.geojson',callback);}
})()
},
Echarts地图使用经验-地图变形和添加数据的更多相关文章
- vue-cli +echarts-amap集成echarts和高德地图TypeError: Cannot read property 'dataToPoint' of null解决方案
由于项目的需求,需要做一种迁徙效果, 最后我们采用了组件化开发,可以说这个坑自己一个人踩,有点累,但也收获不少. vue-cli +echarts-amap集成echarts和高德地图,出现报错,错误 ...
- eCharts二三维地图总结
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.背景 最近多个项目中的登录页面陆续提出了不少地图需求,主要围绕地图的 ...
- ECharts 散点图+百度地图(案例转载)
转载来源:https://efe.baidu.com/blog/echarts-map-tutorial-2/ ECharts 实现地图散点图(下) 小红 2016-06-13 ECharts, ...
- 小程序Echarts 构建中国地图并锚定区域点击事件
小程序Echarts 构建中国地图并锚定区域点击事件 Step1 效果展示 使用的绘图框架为 Echarts for Wexin 具体API文档地址请点击 ----> Step2 条件准备 1. ...
- Bing必应地图中国API-画线与添加多边形
Bing必应地图中国API-画线与添加多边形 2011-05-24 14:31:20| 分类: Bing&Google|字号 订阅 在必应地图上画线的功能应用也很广泛:显示从出发地到 ...
- echarts画中国地图,省市区地图分享
中国地图 四川地图 重庆地图 源码分享: https://github.com/livelyPeng/ec-map
- eCharts动态加载各省份的数据
假如从数据库读出以下数据,如何将数据展示在地图之上 1.部门的名称数据: List deptname=[联通事业部-上海联通项目组, 联通事业部-河南联通项目组, 联通事业部-贵州联通项目组, 联通事 ...
- 关于devexpress报表XtraReport,动态修改报表样式(.repx格式),动态添加数据并使用的理解
一.基本概念: XtraReports 中的每个报表都由 XtraRepot 类的一个实例表示,或者由该类的子类来表示(这种情况更常见). 因此,每个报表都作为带区的容器使用,而每个带区中都包含报表控 ...
- android 3.0+百度地图api地图如何移动到指定的经纬度处
由于百度地图api,2.0+和3.0+的改动比较大,api基本上被全换过了,有些同学可能2.0+的api使用的非常熟悉,但是更新到3.0+时,却会遇到一些小麻烦(由于api变了,你就需要重新学习它的a ...
随机推荐
- Data Center手册(4):设计
基础架构 拓扑图 Switching Path L3 routing at aggregation layer L2 switching at access layer L3 switch融合了三种功 ...
- [Swift]LeetCode236. 二叉树的最近公共祖先 | Lowest Common Ancestor of a Binary Tree
Given a binary tree, find the lowest common ancestor (LCA) of two given nodes in the tree. According ...
- [Swift]LeetCode289. 生命游戏 | Game of Life
According to the Wikipedia's article: "The Game of Life, also known simply as Life, is a cellul ...
- [Swift]LeetCode331. 验证二叉树的前序序列化 | Verify Preorder Serialization of a Binary Tree
One way to serialize a binary tree is to use pre-order traversal. When we encounter a non-null node, ...
- Markdown语法简介
1.标题 在想要设置为标题的文字前面加#来表示一个#代表一级标题,总共六级 2.字体 加粗要加粗的文字左右分别用两个*号包起来 斜体要倾斜的文字左右分别用一个*号包起来 斜体加粗要倾斜和加粗的文字左右 ...
- 【异常】Servlet.service() for servlet [springMvc] in context with path [/orderdishessystem] threw exception [Handler processing failed; nested exception is java.lang.NoClassDefFoundError: net/sf/ezmorph/M
今天做登录的时候,引入json-lib-2.1-jdk15.jar的包时,执行到JSONObject jsonObject = new JSONObject()对象就报标题的那个错. 原来是除了要导入 ...
- 安装ubuntu18.10并连接xshell6
emmmm万万没想到上一篇装的linux内核才3.10,装个ubuntu系统来继续自己的docker学习之旅. 话不多说,先下镜像,地址:http://mirrors.melbourne.co.uk/ ...
- 在tomcat中加入SSL腾讯云证书的步骤
在tomcat中加入SSL证书,可以用https方式访问域名,增加域名的安全性.当然也有很多应用要求https访问,也是安全性的考虑.阿里云和腾讯云都提供SSL证书,还有一些其他的大公司也提供,我这里 ...
- 开始使用Filebeat
认识Beats Beats是用于单用途数据托运人的平台.它们以轻量级代理的形式安装,并将来自成百上千台机器的数据发送到Logstash或Elasticsearch. (画外音:通俗地理解,就是采集数据 ...
- .net core 2.0 Code First Fluent API配置
A.net core 2.0新特性支持通过IEntityTypeConfiguration<>添加Code First配置到一个封装类. 新建目标框架为.NET Core类库 新建完了以后 ...