echarts2地图省份依次高亮显示的demo
来源:互联网 发布:数据分析报告模板 编辑:程序博客网 时间:2024/06/07 01:41
在echarts2中我找不到dispatchAction的方法,所以通过多次setOption来实现省份的逐个高亮
代码:
<script src="http://echarts.baidu.com/build/dist/echarts-all.js"></script>
<script>
var mycharts = echarts.init(document.getElementById('charts'))
option = {
series : [
{
name: '中国',
type: 'map',
mapType: 'china',
selectedMode : 'single',
hoverable: false,
itemStyle:{
normal:{label:{show:true}},
emphasis:{label:{show:true}}
},
data:[
{name:'广东',selected:true},
{name:'广西',selected:false},
{name:'河南',selected:false},
{name:'河北',selected:false},
{name:'黑龙江',selected:false},
{name:'山西',selected:false},
{name:'甘肃',selected:false}
]
}
]
};
mycharts.setOption(option);
var provArr = ['广东', '广西', '河南', '河北', '黑龙江', '山西', '甘肃']
var num = 0
setInterval(function(){
num = (num+1) % provArr.length
for(let i in provArr){
if(i == num){
option.series[0].data[i].selected = true
}else{
option.series[0].data[i].selected = false
}
}
// option.series[0].data = [{name:provArr[num],selected:true}] 单独设data里的一项是不行的,会出现逐个高亮,最后全部高亮
mycharts.setOption(option);
},1000);
</script>
这个只是做了一个小效果,后面还要和其他效果结合在一起。
echarts初学阶段,如果有错误的地方请指出。
- echarts2地图省份依次高亮显示的demo
- echarts2的一个地图demo
- echarts地图某些省份禁止高亮显示
- clistctrl选中高亮依次显示
- echarts2和百度地图的简单应用
- echarts2.0的formatter显示过长问题
- js省份的显示
- android 高德地图Demo 的使用
- 高德地图的小demo
- 高德地图开发--地图的显示
- 关于echarts省份地图不显示
- 高德地图demo
- 高德地图定位demo
- Echarts2竖直datazoom滑动后显示数据不全的解决方法
- IOS使用高德地图的基本DEMO
- 关于android高德地图地图无法显示的问题
- Android Studio 关于高德地图的开发:显示地图
- Android 高德地图,显示最基本的地图
- php微信公众平台接口(五)——微信网页授权
- MySQL基础操作之对数据库和表的增删改查
- 快速实现复制到剪贴板
- 虚幻引擎学习之路:相机图像后处理
- SylixOS下Yaffs挂载参数说明
- echarts2地图省份依次高亮显示的demo
- Spring Boot + MongoDB
- 指数加权平均和momentum梯度下降
- 【Java】【正则表达式】正则表达式
- 转换maven 项目为web 项目
- java
- UIApplication的方法
- es6-箭头函数中的this使用
- 习题3-9 子序列(All in All, UVa 10340)