实例页面:http://echarts.baidu.com/echarts2/doc/example/event.html

option = {
tooltip : {
trigger: 'axis'
},
legend: {
data:['最高','最低']
},
toolbox: {
show : true,
feature : {
mark : {show: true},
dataView : {readOnly:false},
magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},
restore : {show: true},
saveAsImage : {show: true}
}
},
calculable : true,
dataZoom : {
show : true,
realtime : true,
start : 40,
end : 60
},
xAxis : [
{
type : 'category',
boundaryGap : true,
data : function (){
var list = [];
for (var i = 1; i <= 30; i++) {
list.push('2013-03-' + i);
}
return list;
}()
}
],
yAxis : [
{
type : 'value'
}
],
series : [
{
name:'最高',
type:'line',
data:function (){
var list = [];
for (var i = 1; i <= 30; i++) {
list.push(Math.round(Math.random()* 30) + 30);
}
return list;
}()
},
{
name:'最低',
type:'bar',
data:function (){
var list = [];
for (var i = 1; i <= 30; i++) {
list.push(Math.round(Math.random()* 10));
}
return list;
}()
}
]
};
var ecConfig = require('echarts/config');
function eConsole(param) {
var mes = '【' + param.type + '】';
if (typeof param.seriesIndex != 'undefined') {
mes += ' seriesIndex : ' + param.seriesIndex;
mes += ' dataIndex : ' + param.dataIndex;
}
if (param.type == 'hover') {
document.getElementById('hover-console').innerHTML = 'Event Console : ' + mes;
}
else {
document.getElementById('console').innerHTML = mes;
}
console.log(param);
}
/*
// -------全局通用
REFRESH: 'refresh',
RESTORE: 'restore',
RESIZE: 'resize',
CLICK: 'click',
DBLCLICK: 'dblclick',
HOVER: 'hover',
MOUSEOUT: 'mouseout',
// -------业务交互逻辑
DATA_CHANGED: 'dataChanged',
DATA_ZOOM: 'dataZoom',
DATA_RANGE: 'dataRange',
DATA_RANGE_HOVERLINK: 'dataRangeHoverLink',
LEGEND_SELECTED: 'legendSelected',
LEGEND_HOVERLINK: 'legendHoverLink',
MAP_SELECTED: 'mapSelected',
PIE_SELECTED: 'pieSelected',
MAGIC_TYPE_CHANGED: 'magicTypeChanged',
DATA_VIEW_CHANGED: 'dataViewChanged',
TIMELINE_CHANGED: 'timelineChanged',
MAP_ROAM: 'mapRoam',
*/
myChart.on(ecConfig.EVENT.CLICK, eConsole);
myChart.on(ecConfig.EVENT.DBLCLICK, eConsole);
//myChart.on(ecConfig.EVENT.HOVER, eConsole);
myChart.on(ecConfig.EVENT.DATA_ZOOM, eConsole);
myChart.on(ecConfig.EVENT.LEGEND_SELECTED, eConsole);
myChart.on(ecConfig.EVENT.MAGIC_TYPE_CHANGED, eConsole);
myChart.on(ecConfig.EVENT.DATA_VIEW_CHANGED, eConsole);

echart绑定点击事件的更多相关文章

  1. jQuery实现当按下回车键时绑定点击事件

    jQuery实现当按下回车键时绑定点击事件 <script> $(function(){ $(document).keydown(function(event){ if(event.key ...

  2. (转载)js(jquery)的on绑定点击事件执行两次的解决办法

    js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 遇到的问题:jquery中用.on()给页面中新加的元素添加点击事件时,点击事件源,绑定的事件执行两次,这里的ale ...

  3. 通过jQuery给<li>绑定点击事件

    背景:有个需求需要js中实现li标签的事件绑定,li通过在ajax请求中动态添加,按照常理,使用jQuery,可以使用以下方法绑定点击事件: $(function(){  commonAjaxCall ...

  4. a标签绑定点击事件失败

    如图 然后对a标签绑定点击事件  无效 换成span标签可以

  5. JQuery 动态加载 HTML 元素时绑定点击事件无效问题

    问题描述 假设项目中有一个列表页面,如下: 当点击列表一行数据可以显示详情页面,而详情页面的数据是根据当前行的数据作为参数,通过 ajax 请求到后台返回的数据,再根据返回的结果动态生成 html 页 ...

  6. Angularjs 中使用指令绑定点击事件

    项目中,模板中的菜单是jQuery控制的,在Angularjs中就运行不到了,因为菜单项是ng-repeat之后的. 如html <ul id="main-menu"> ...

  7. jq回车触发绑定点击事件

    //jq绑定回车事件触发点击事件<script> $(function(){ $(document).keyup(function(event){ if(event.keyCode ==1 ...

  8. html A标签 绑定点击事件。跳转页面。处理

    在平时的页面中,肯定有需要点击A标签 进行处理. 这时候习惯性的绑定一个点击事件进行数据处理. 在A标签中 herf="#" 然后绑定一个点击事件. 或者在A标签里面的元素里面有一 ...

  9. iOS小技巧 - 如何使UIView可以绑定点击事件

    让我们这次直接进入正题,有时候我们想做以下这种界面: 目前我就想到三种方案: 做一个tableview,然后组织cell的界面如上图所示 做一个button子类,使得button的界面能如上图所示 做 ...

随机推荐

  1. UVA - 1218 Perfect Service(树形dp)

    题目链接:id=36043">UVA - 1218 Perfect Service 题意 有n台电脑.互相以无根树的方式连接,现要将当中一部分电脑作为server,且要求每台电脑必须连 ...

  2. 信号处理函数(3)-sigaction() 为信号注册信号捕捉函数

    定义: int sigaction(int signum,const struct sigaction *act ,struct sigaction *oldact); 表头文件: #include& ...

  3. Observable 示例之 Windows Phone 列表内项目逐个加载

    在写 Windows phone应用性能优化(一)的时候,在 ListBox 的项加载的时候,添加了一些简单的动画. 其实在 Windows Phone 的应用中使用 Blend 设计动画是很容易的, ...

  4. HADOOP 2.6 INSTALLING ON UBUNTU 14.04 (hadoop 2.6 部署到ubuntu 14.04上面)

    Hadoop on Ubuntu 14.04 In this chapter, we'll install a single-node Hadoop cluster backed by the Had ...

  5. oracle解惑

    1. 先在google, 论坛,metalink, online document 里搜索.     在这里提供Oracle 一些常见的连接地址,包括Oracle 下载地址,Oracle 对个人用是免 ...

  6. JS学习笔记(4)--js变量的生命周期

    http://www.cnblogs.com/williamxiao/p/3499973.html 最近看国外经典教材的时候发现JavaScript与熟知的Java,C,C++都不同的特性,其中一个就 ...

  7. php代码检查

    最近写php,几个同事都是没写过c的,经常写的变量没有定义,而php没有编译,错误无法发现. 我们现在用的是NetBeans,好在其提供了语法检测,如下图,让编辑器强制显示我错误

  8. [Linux]read/write和fread/fwrite有什么区别

    转自:http://blog.csdn.net/xiaofei0859/article/details/51145051 二者都是对文件进行操作,那么二者有什么区别,用的时候该如何选择呢? 1. 区别 ...

  9. php -- 魔术方法 之 判断属性是否存在或为空:__isset()

    属性重载:当访问一个不存在或者权限不够的属性的时候,能够触发一系列的魔术方法,就叫做属性重载 __isset($name):当使用 isset()函数或者empty()函数 判断属性是否存在或者是否为 ...

  10. Virtual Box下安装Oracle Linux 6.3

    Oracle Linux 6.3已经公布快2年了,其功能有非常大的提升,增强了KVM,文件卷的在线resizing,LVM支持 raid4, 5, 6.支持很多其它的虚拟CPU数以及更大内存,详细能够 ...