Echarts 南海诸岛简图显示位置调整
最近需要echart同时显示海南岛和南海诸岛,开始想寻找南海诸岛的数据,经过查找,这种简图数据是没有的(china.js地图数据一一找过了),下图是echarts的一些示例,没有满足我们的要求
后来在echarts.min.js中通过关键字'南海诸岛'查找到了关键的代码,echarts在地图名为china时,加入南海诸岛数据,然后经过坐标变换(先设置缩放比率再平移到指定点)展示到echart地图中。
要想海南岛地图和南海诸岛简图显示到一起并不复杂。总共只要改四个参数就好了。
首先要修改左上角位置点,原先的源码设置[126, 25],要想修改靠近海南岛需要把这两个数值改小点[110.5, 18.5]。然后,修改hA[cA][dA][0] /= 300, hA[cA][dA][1] /= -300,这里的参数是设置缩放比率的。
echarts.js和echarts.min.js的修改略有不同,原因还不太清楚
附:https://github.com/tpolong/echartshn
Echarts 南海诸岛简图显示位置调整的更多相关文章
- 关于echarts中南海诸岛的显示问题
1.china.js 文件中 echarts.registerMap('china', //名字要是'china',不能写成'中国' 2.echarts 配置中地图名称 mapName: ...
- echarts之字符云tooltip显示混乱问题的解决办法
echarts字符云中tooltip显示混乱主要表现为一下两点: 1.字体与其显示框内容不对应鼠标识别错误 解决思路: 就是option里的数据要对value降序排序(这一点很关键,是必须的一步) 把 ...
- Echarts饼图更改颜色、显示数据且换行
var option = { title : { text: '数据来源', x:'center' }, tooltip : { trigger: 'i ...
- echarts彩虹柱状图 每个bar显示不同颜色, 标题在不同位置 ,工具中有可以直接保存为图片下载,平均线的添加
可以参考: https://echarts.baidu.com/echarts2/doc/example.html https://echarts.baidu.com/echarts2/doc/doc ...
- Echarts 的悬浮框tooltip显示自定义格式化
最近做的项目用到echarts雷达图,但是由于地市过多,遇到悬浮框显示问题被遮住 如图: 可以看到上面从兴安开始数据就被遮住了 为了解决这个被遮住的悬浮框,达到tooltip自定义格式 完成后的效果如 ...
- echarts x轴坐标文字显示不全
在echarts中应用柱状图或者折线图时,当数据量过多的时候,X轴的坐标就会显示不全(如下图图一),在ECharts图表组件内部有一个机制,用于统计xAxis坐标刻度的个数和图表宽度,从而会自动调整刻 ...
- Echarts按需引入后没有显示图例问题
因为Echarts官网的例子都是引入整个Echarts.js.如果使用按需引入对应模块就要记得引入legend模块,才能显示出图例. 例如这样: require("echarts/lib/c ...
- echarts自定义悬浮框的显示
最近在使用echarts的地图功能 ,业务需求是显示前五的具体信息,并且轮流显示,首先解决轮流显示的问题 var counta = 0; //播放所在下标 var mTime = setInterva ...
- echarts Map(地图) 不同颜色区块显示
以河南地图为例: 代码如下: <h3>天翼日必达完成率</h3> <div id="map" style="height:340px; te ...
随机推荐
- Python_os、os.path、os.shutil使用案例
import os import os.path print(os.path.basename('/Users/c2apple/Desktop/彩屏')) #获取路径的最后一个组成部分 os.path ...
- 【转】sentry 实时事件日志聚合平台
1.install postgreSQL(v9.6)2.pip install sentry(v8.13.0)3.sentry init #初始化配置文件 4.配置好postgreSQL 需要连接re ...
- thinkphp 自动生成模块目录结构
要达到的目的 在application目录下创建自定义模块如admin,用命令行方式自动创建该目录及目录下默认结构 要运行的命令 > php think build --module admin ...
- Linux时间子系统之二:Alarm Timer
一.前言 严格来讲Alarm Timer也算POSIX Timer一部分,包含两种类型CLOCK_REALTIME_ALARM和CLOCK_BOOTTIME_ALARM.分别是在CLOCK_REALT ...
- matplotlib使用时报错RuntimeError: Python is not installed as a framework(一)
笔者在第一次安装matplotlib后运行时出现报错. import matplotlib as mlb from matplotlib import pylab as pl x = [1,3,5,7 ...
- HTML基础篇(标签和属性整--已剔除不被浏览器支持的部分)
行内元素有:a b span img input select strong 块级元素有:div ul ol li dl dt dd h1 h2 h3 h4…p HTML 参考手册- (HTML5 标 ...
- Android FoldingLayout 折叠布局 原理及实现(二)
转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/44283093,本文出自:[张鸿洋的博客] 1.概述 在上一篇Android Fo ...
- Centos7 修改硬件时间和系统时间
查看系统时间 [root@localhost ~]# date Tue Jun 13 10:20:13 CST 2017 查看硬件时间 [root@localhost ~]# hwclock --sh ...
- 转载:python + requests实现的接口自动化框架详细教程
转自https://my.oschina.net/u/3041656/blog/820023 摘要: python + requests实现的接口自动化框架详细教程 前段时间由于公司测试方向的转型,由 ...
- &&和&、||和|的区别
&& 和 || 为短路与 短路或&&若前面的表达式为false,整个逻辑表达式为false,所以后面的表达式无论true和false都无法影响整个表达式的逻辑结果,所以 ...