查看echarts api -----   https://www.echartsjs.com/zh/api.html#echarts

搜索

1.dispatchAction   执行的关键

2.highlight    变换显示的关键

3.tooltip   变幻时 显示提示框的关键

关键代码:

1. myChartSalarypie.setOption({});   设置自己的的option 内容

2. myChartSalarypie.dispatchAction({type: 'downplay',seriesIndex: 0,dataIndex: curIndex});

3.myChartSalarypie.dispatchAction({type: 'highlight',seriesIndex: 0,dataIndex: curIndex});

4.myChartSalarypie.dispatchAction({
                                        type:'showTip',
                                        seriesIndex:0,
                                        dataIndex:curIndex
                                    });

跳动的完整代码:

if( runFlag !=null )
                                  {
                                       clearInterval(runFlag);
                                       runFlag = null ;
                                  }
                       if(curIndex == null) {
                           myChartSalarypie.dispatchAction({type: 'highlight',seriesIndex: 0,dataIndex: 0});
                        }
                        else {
                            myChartSalarypie.dispatchAction({type: 'highlight',seriesIndex: 0,dataIndex: curIndex});
                            myChartSalarypie.dispatchAction({
                                        type:'showTip',
                                        seriesIndex:0,
                                        dataIndex:curIndex
                                    });
                             
                               runFlag = setInterval(function () {
                                    var dataLen = showDate.length;
                                    // 取消高亮
                                    myChartSalarypie.dispatchAction({type: 'downplay',seriesIndex: 0,dataIndex: curIndex});
                                    curIndex = (curIndex + 1) % dataLen;
                                    //设置高亮
                                    myChartSalarypie.dispatchAction({type: 'highlight',seriesIndex: 0,dataIndex: curIndex});
                                    myChartSalarypie.dispatchAction({
                                        type:'showTip',
                                        seriesIndex:0,
                                        dataIndex:curIndex
                                    });
                                }, 3000);
                                }
                       openRunFlag=false;

记录一次echarts 中bar 定时跳跃并显示内容的更多相关文章

  1. ECharts 中的事件和行为

    在 ECharts 的图表中用户的操作将会触发相应的事件.开发者可以监听这些事件,然后通过回调函数做相应的处理,比如跳转到一个地址,或者弹出对话框,或者做数据下钻等等. 如下是一个绑定点击操作的示例. ...

  2. ECharts SSH+JQueryAjax+Json+JSP将数据库中数据填充到ECharts中

    本文引用自:http://blog.csdn.net/ArcticFoxHan/article/details/38071641   1.导入包,搭建SSH框架 导入Jquery的JS包,<sc ...

  3. Unity 2D游戏开发教程之游戏中精灵的跳跃状态

    Unity 2D游戏开发教程之游戏中精灵的跳跃状态 精灵的跳跃状态 为了让游戏中的精灵有更大的活动范围,上一节为游戏场景添加了多个地面,于是精灵可以从高的地面移动到低的地面处,如图2-14所示.但是却 ...

  4. echarts 中 柱图 、折线图、柱图层叠

    app.title = '折柱混合'; option = { tooltip: { trigger: 'axis', axisPointer: { type: 'cross', crossStyle: ...

  5. Linux中的定时自动执行功能(at,crontab)

    Linux中的定时自动执行功能(at,crontab) 概念 在Linux系统中,提供了两种提前对工作进行安排的方式 at 只执行一次 crontab 周期性重复执行 通过对这两个工具的应用可以让我们 ...

  6. 【Matlab开发】matlab中bar绘图设置与各种距离度量

    [Matlab开发]matlab中bar绘图设置与各种距离度量 标签(空格分隔): [Matlab开发] [机器学习] 声明:引用请注明出处http://blog.csdn.net/lg1259156 ...

  7. WebAPI中的定时处理-使用Quartz.Net

    借鉴: https://blog.csdn.net/lordwish/article/details/78926252 在最近的一篇文章中讲到了如何在web API中实现定时处理,采用的是比较原始的T ...

  8. JSP中页面定时刷新

    1.JSP中页面定时刷新 <% //页面每隔30秒自动刷新一遍 response.setHeader("refresh" , "30" ); %> ...

  9. 提取 ECharts 中的svg地图信息

    地图的需求还是蛮大的,全国都要自己画的话,还是需要投入比较大的人力. ECharts中有地图,那我们能不能把里面的地图文件提取出来呢,主要逻辑在map.js中. 看源代码发现,ECharts中地图信息 ...

  10. Spring中实现定时调度

    1,   内容简介 所谓的定时调度,是指在无人值守的时候系统可以在某一时刻执行某些特定的功能采用的一种机制,对于传统的开发而言,定时调度的操作分为两种形式: 定时触发:到某一时间点上执行某些处理操作: ...

随机推荐

  1. 下载接口时出现:Try to run this command from the system terminal. Make sure that you use the correct version of 'pip' installed for your Python interpreter located at 'D:\python\demo\venv\Scripts\...的错误

    下载接口时出现:Try to run this command from the system terminal. Make sure that you use the correct version ...

  2. 【C++】【纯代码】获取电脑的mac地址

    bool GetMacAddress(CString &LanMAC) { #define MAX_ADAPTER_NAME_LENGTH 256 #define MAX_ADAPTER_DE ...

  3. 从傻逼才做的大创开始的NLP学习

    先实名辱骂一下保加利亚电信的毕业生,留个源码,源码里把自己训好的模型删了,洗好的文本删了,什么都给删了,白茫茫一片真他妈干净. 简单说说目前在做的这个东西,姑且算是个项目吧: 给出一个问句,通过实体识 ...

  4. HBase建命名空间建表

    public class HBaseDDL { //声明一个静态属性 static public Connection conn = HBaseConnection2.conn; /** * 创建命名 ...

  5. (1127)arm 架构, c++模板

    (1)ARM M0 (2)c++形参

  6. [转]md Typora旧版免费安装包(多平台版本)

    typora旧版免费安装包: 链接:https://pan.baidu.com/s/1pIqeO2nTJ9_s16IZj6z3sA?pwd=gut4 提取码:gut4 v1.0以上的版本都要收费了,我 ...

  7. API对象--Ingress(chrono《kubernetes入门实战课》笔记整理)

    [概念说明] Service 的功能和运行机制,主要由 kube-proxy 控制的四层负载均衡,即根据IP.PORT来做负载均衡.而很多应用都是在7层做均衡更为合理,比如根据主机名.URI.请求头. ...

  8. Mybatis动态SQL语句大全

    读完这篇文章里你能收获到 Mybatis动态SQL语句大全 Mybatis中如何定义变量 Mybatis中如何提取公共的SQL片段 1. If 语句 需求:根据作者名字和博客名字来查询博客!如果作者名 ...

  9. OSPF配置知识总结2(单区域)

    OSPF配置知识总结2 静态路由有静态路由的好处,但也有弊端,牵一发动全身,在一个路由路径上,只要变一个,其他所有的路由器上的静态路由都要跟着改变. 用动态路由OSPF很简单就能解决这个问题.如下: ...

  10. DataTable中排序的开启与禁用

    1. 2. orderable设置成true会打开排序功能,设置为false会禁用排序功能.