最近需要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 南海诸岛简图显示位置调整的更多相关文章

  1. 关于echarts中南海诸岛的显示问题

    1.china.js 文件中  echarts.registerMap('china',    //名字要是'china',不能写成'中国'   2.echarts 配置中地图名称 mapName: ...

  2. echarts之字符云tooltip显示混乱问题的解决办法

    echarts字符云中tooltip显示混乱主要表现为一下两点: 1.字体与其显示框内容不对应鼠标识别错误 解决思路: 就是option里的数据要对value降序排序(这一点很关键,是必须的一步) 把 ...

  3. Echarts饼图更改颜色、显示数据且换行

    var option = {   title : {       text: '数据来源',       x:'center'   },   tooltip : {       trigger: 'i ...

  4. echarts彩虹柱状图 每个bar显示不同颜色， 标题在不同位置 ，工具中有可以直接保存为图片下载，平均线的添加

    可以参考: https://echarts.baidu.com/echarts2/doc/example.html https://echarts.baidu.com/echarts2/doc/doc ...

  5. Echarts 的悬浮框tooltip显示自定义格式化

    最近做的项目用到echarts雷达图,但是由于地市过多,遇到悬浮框显示问题被遮住 如图: 可以看到上面从兴安开始数据就被遮住了 为了解决这个被遮住的悬浮框,达到tooltip自定义格式 完成后的效果如 ...

  6. echarts x轴坐标文字显示不全

    在echarts中应用柱状图或者折线图时,当数据量过多的时候,X轴的坐标就会显示不全(如下图图一),在ECharts图表组件内部有一个机制,用于统计xAxis坐标刻度的个数和图表宽度,从而会自动调整刻 ...

  7. Echarts按需引入后没有显示图例问题

    因为Echarts官网的例子都是引入整个Echarts.js.如果使用按需引入对应模块就要记得引入legend模块,才能显示出图例. 例如这样: require("echarts/lib/c ...

  8. echarts自定义悬浮框的显示

    最近在使用echarts的地图功能 ,业务需求是显示前五的具体信息,并且轮流显示,首先解决轮流显示的问题 var counta = 0; //播放所在下标 var mTime = setInterva ...

  9. echarts Map(地图) 不同颜色区块显示

    以河南地图为例: 代码如下: <h3>天翼日必达完成率</h3> <div id="map" style="height:340px; te ...

随机推荐

  1. app电量测试

    一．测试前准备 样本A:商家端2.6.4版本为基准样本(即旧版本): 样本B:商家端2.6.5版本(未正式上线,可找RD协助打包): 推荐Android 5.0及以上手机2台或多台(根据RD本次测试需 ...

  2. CDN及CDN加速原理

    本想自己写这个主题的文章,但网上已经有人写了一篇非常好的文章,觉得难以望其项背.就没有必要再写,直接转载如下: 在不同地域的用户访问网站的响应速度存在差异,为了提高用户访问的响应速度.优化现有Inte ...

  3. Eclipse从数据库逆向生成Hibernate实体类和映射文件（Eclipse插件系列之HibernateTools）

    ♣下载安装Eclipse插件(HibernateTools) ♣Eclipse连接数据库(Mysql5.7) ♣新建hibernate.properties和hibernate.cfg.xml文件 ♣ ...

  4. SSM-MyBatis-18：Mybatis中二级缓存和第三方Ehcache配置

    ------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥------------- 二级缓存 Mybatis中,默认二级缓存是开启的.可以关闭. 一级缓存开启的.可以被卸载吗?不可以的.一级缓存 ...

  5. sql server 高可用日志传送

    一. 日志传送概述 SQL Server使用日志传送,可以自动将主服务器的事务日志备份发送到一个或多个辅助数据库上.可选的监视服务器,记录备份和还原操作的历史记录及状态. 优点 提供灾难恢复解决方案 ...

  6. scrapy分布式爬虫scrapy_redis二篇

    =============================================================== Scrapy-Redis分布式爬虫框架 ================ ...

  7. Oracle解决Ora-01653无法扩展表空间问题

    先针对可能性1查看表空间使用情况 SELECT UPPER(F.TABLESPACE_NAME) "表空间名", D.TOT_GROOTTE_MB "表空间大小(M) & ...

  8. BinaryOperator<T>接口的用法示例+BiFunction

    转自http://www.tpyyes.com/a/java/2017/1015/285.html 转自https://blog.csdn.net/u014331288/article/details ...

  9. 终于将 SQL Server 成功迁移至 MySQL8.0 啦！！！

    之前一直使用 SQL Server 作为主数据库而不是 MySQL ,原因之一是单机 SQL Server 性能比 MySQL 强很多,另一个原因是之前客户的系统管理员大多只有 SQL Server ...

  10. 在C++中怎么判断一个double型数据的小数点部分是否为零

    例:double sf = 123.123: 这里我们怎么判断sf小数点部分是否为零,可以直接用原数减去将sf强制转换后的整数是否为零来判断. if((sf - (int)sf) == 0),则说明s ...