码迷,mamicode.com
首页 > 其他好文 > 详细

Echarts 南海诸岛简图显示位置调整

时间:2018-10-22 17:54:32      阅读:1206      评论:0      收藏:0      [点我收藏+]

标签:坐标   china   设置   要求   use   hub   技术   .com   cdn   

????最近需要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 南海诸岛简图显示位置调整

标签:坐标   china   设置   要求   use   hub   技术   .com   cdn   

原文地址:https://www.cnblogs.com/polong/p/9831036.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!