ECharts 支持常规的鼠标事件类型，包括 'click'、'dblclick'、'mousedown'、'mousemove'、

'mouseup'、'mouseover'、'mouseout'、'globalout'、'contextmenu' 事件。下面先来看一个简单的点击柱状图后打开相应的百度搜索页面的示例。
 <script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.2.1/echarts-en.common.js"></script> //引入在线

</head>

<body>

  <div id="demo1" style="width: 600px; height:400px">

   </div>

</body>

   <script type="text/javascript">

        // 基于准备好的dom，初始化echarts实例

        var demo1 = echarts.init(document.getElementById('demo1'));

        // 指定图表的配置项和数据

        var option = {

            title: {

                text: 'ECharts 入门示例'

            },

            tooltip: {},

            legend: {

                data:['销量']

            },

            xAxis: {

                data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]

            },

            yAxis: {},

            series: [{

                name: '销量',

                type: 'bar',

                data: [5, 20, 36, 10, 10, 20]

            }]

        };

        // 使用刚指定的配置项和数据显示图表。

        demo1.setOption(option);

        //注册事件

        demo1.on('click', function (params) {

          //params包含很多的信息 下标索引  如横坐标名称  对应的值

          console.log("click",params);

        });

//ECharts 支持常规的鼠标事件类型，包括 'click'、'dblclick'、'mousedown'、'mousemove'、

// 'mouseup'、'mouseover'、'mouseout'、'globalout'、'contextmenu' 事件。下面先来看一个简单的点击柱状图后打开相应的百度搜索页面的示例。

  </script>

echarts-中的事件-- demo1.on('事件类型', function (params) {}的更多相关文章

  1. ECharts 中的事件和行为

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

  2. 在 SharePoint Server 2013 中配置建议和使用率事件类型

    http://technet.microsoft.com/zh-cn/library/jj715889.aspx 适用于: SharePoint Server 2013 利用使用事件,您可以跟踪用户与 ...

  3. Javascript中的事件对象和事件类型

    接上次看JS的事件冒泡和捕获,所以顺带就把事件相关的知识都看完好了 而且想到一个好的学习方法,第一天自己看,第二天把前一天学习的东西写下来,一方面可以当复习,一方面当重新整理并且分享 事件对象 事件处 ...

  4. js中的事件委托或是事件代理详解

    起因: 1.这是前端面试的经典题型,要去找工作的小伙伴看看还是有帮助的: 2.其实我一直都没弄明白,写这个一是为了备忘,二是给其他的知其然不知其所以然的小伙伴们以参考: 概述: 那什么叫事件委托呢?它 ...

  5. JS 中的事件绑定、事件监听、事件委托

    事件绑定 要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数.所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称. 在JavaScript中,有 ...

  6. denounce函数：Javascript中如何应对高频触发事件

    在DOM Event的世界中,以scroll.resize.mouseover等为代表的高频触发事件显得有些与众不同.通常,DOM事件只有在明确的时间点才会被触发,比如被点击,比如XMLHttpReq ...

  7. [原创]java WEB学习笔记48：其他的Servlet 监听器：域对象中属性的变更的事件监听器 （3 个），感知 Session 绑定的事件监听器（2个）

    本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当 ...

  8. js中冒泡事件和捕获事件

    js中冒泡事件和捕获事件: 冒泡事件:冒泡事件是从里向外,即是从被绑定元素开始一直向外到达页面的所有祖先元素都会被触发,这 一过程被称为事件冒泡.这个事件从原始元素开始一直冒泡到DOM树的最上层 捕获 ...

  9. ASP.NET中定制自己的委托和事件参数类

    本文笔记选自<庖丁解牛:纵向切入ASP.NET 3.5控件和组件开发技术>一书 一般在实际开发中,对于事件不需要传递数据信息时,像上面的KingTextBox控件的事件,在引发事件时传递的 ...

随机推荐

  1. luoguP3017Brownie Slicing

    https://www.luogu.org/problem/P3017 题意 给你一个蛋糕,R行C列 ,每个点有巧克力碎屑(如下) 1 2 2 1 3 1 1 1 2 0 1 3 1 1 1 1 1 ...

  2. JMeter配置数据库连接

    在平时接口的测试中,很多时候是需要直接连接数据库,查询对应数据信息的. 我将其中一些内容整理出来,方便以后调阅. 1.首先是配置数据库的连接,也就是JDBC Connection Configurat ...

  3. day8_类的装饰器和反射

    """ 类的装饰器: @property 当类的函数属性声明 @property后, 函数属性不需要加括号 即可调用 @staticmethod 当类的函数属性声明 @s ...

  4. 批量文件B中选出部分文件（与A文件夹数量相同），放到C中

    import glob import os,sys import shutil fileDir = 'F:/project/Breast/InBreast/INBreast/outimgpatch/n ...

  5. Vue介绍（一）

    官网:https://cn.vuejs.org/ Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.V ...

  6. MySQL SQL DLL (数据定义语言)

    CREATE CREATE DATABASE CREATE DATABASE 用于创建数据库 CREATE DATABASE new_database_name; CREATE TABLE CREAT ...

  7. 关于一个.2lf和.2f的战争！（貌似书上错了，静待打脸。）

    在山东理工oj上做题,谈到了输入数据... double i: scanf(“%lf”,&i): 谨记呀,lf时,可以输入任何类型的数据,而.2f,只能输入符合其规格的数据. 再谈输出,dou ...

  8. Forethought Future Cup - Elimination Round C 二分 + 交互(求树的直径)

    https://codeforces.com/contest/1146/problem/C 题意 一颗大小为n的树,每次可以询问两个集合,返回两个集合中的点的最大距离,9次询问之内得出树的直径 题解 ...

  9. STM32移植ROS--发布超声波信息

    前言:之前ROS跟单片机的底层通讯主要是通过串口自定的协议来做,比如官网提供的arduino串口驱动一样,需要ROS往下发一个指令,单片机再回传一个指令,要写一大堆的协议,这样很麻烦,效率也比较低, ...

  10. 深圳龙华有轨电车BIM项目

    本项目是“龙华有轨电车BIM+GIS运维管理平台“研发组成的内容之一,包含站台.电车.变电所等模型绘制. 龙华区有轨电车是深圳市的一条位于龙华区的有轨电车线路,项目规划了三条线路,总长51公里.试验线 ...