echarts中地图重叠问题解决
更新时间：2023年08月01日 10:19:03 作者：觉醒法师
在使用Echarts开发项目时,经常会遇到地图组件的开发,困扰许久的地图重叠问题,本文就来解决一下这个问题,感兴趣的可以了解一下
在使用Echarts开发项目时，经常会遇到地图组件的开发，困扰许久的地图重叠问题，无意间在echarts官方文档中找到了解决方案。
示例：
如上图，其代码如下：
geo: {
backgroundColor:'#232e67',
map: 'china',
roam: true,
},
series: [
{
backgroundColor:'#232e67',
name: '用户分布',
type: 'map',
mapType: 'china',
data: []
}
]该写法会造成上图地图重叠现象，对于该问题，在echarts官方文档中找到了答案，可以通过 geoIndex属性指定geo组件
官方叙述如下：
默认情况下，map series会自己生成内部专用的geo组件。但是也可以用 geoIndex 指定一个geo组件。这样的话，map和其他 serise中的type=map可以共享一个geo组件。并且，Geo组件的颜色也可以被这个map serise控制。当设定 geoIndex后，series-map.map属性，以及series-map.itemStyle等样式配置不再起作用，而是采用geo中的相应属性。
代码如下修改即可：
geo: {
backgroundColor:'#232e67',
map: 'china',
roam: true,
},
series: [
{
backgroundColor:'#232e67',
name: '用户分布',
type: 'map',
mapType: 'china',
geoIndex: 0,
data: []
}
]
只要添加geoIndex属性，即可将series中的map数据，指定到Geo组件上了。
到此这篇关于echarts中地图重叠问题解决的文章就介绍到这了,更多相关echarts 地图重叠内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
javascript下搜索子字符串的的实现代码(脚本之家修正版)
由于我的项目中要求到要对一个字符串进行查找，其查找要求有点BT了2009-12-12
javascript巧用eval函数组装表单输入项为json对象的方法
这篇文章主要介绍了javascript巧用eval函数组装表单输入项为json对象的方法,实例分析了JavaScript使用eval函数动态构造json对象的相关技巧,需要的朋友可以参考下2015-11-11
这篇文章主要为大家详细介绍了PHP实现本地图片上传和验证功能的相关资料，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-02-02
作用域是指程序源代码中定义变量的区域,作用域规定了如何查找变量，也就是确定当前执行代码对变量的访问权限,这篇文章主要给大家介绍了关于JavaScript静态作用域和动态作用域的相关资料,需要的朋友可以参考下2021-10-10
这篇文章主要介绍了小程序毫秒级倒计时，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-05-05
JavaScript事件的默认行为指浏览器自动执行的操作,如链接跳转或表单提交,阻止这些行为可以使用event.preventDefault()、return false或event.returnValue属性,event.stopPropagation()用于阻止事件传播,不直接阻止默认行为,需要的朋友可以参考下2024-10-10
这篇文章给大家详细介绍了javascript中双等号(==)隐性转换机制，非常不错，具有参考借鉴价值，需要的朋友参考下吧2017-10-10
读取注册表的键值的方法有很多，在本文将为大家详细介绍下使用js如何实现注册表的键值读取，感兴趣的朋友可以参考下2013-09-09
下面小编就为大家带来一篇xcode中获取js文件的路径方法(推荐)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-11-11
javascript 从if else 到 switch case 再到抽象
大家觉得在接手遗留代码时，见到什么东东是最让人感到不耐烦的？复杂无比的 UML ？我觉得不是。2010-07-07
最新评论