echarts柱状图点击阴影部分触发事件
在很多时候我们的柱状图分布不均匀,有些柱高可能会很小,如果通过myChart.on('click',function(){})来促发事件,可能在点击的时候不好操作,因为这个click事件是绑定在各个serie上的,也就是单个柱子上,可以通过param参数获取点击的serie信息。但是如果要满足在柱高非常小的时候,也能有点击事件,我们可以对在整个对serie的阴影部分绑定。如下:
myChart.getZr().on('click',function(params){
const pointInPixel= [params.offsetX, params.offsetY];
if (cityChart.containPixel('grid',pointInPixel)) {
var xIndex=cityChart.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
function(xIndex){
...
};
}
});
echarts柱状图点击阴影部分触发事件的更多相关文章
- vue Echarts 柱状图点击事件
drawBar(){ let that = this; let chart = this.$echarts.init(document.getElementById('bar-graph')); le ...
- js点击空白处触发事件
我们经常会出现点击空白处关闭弹出框或触发事件 <div class="aa" style="width: 200px;height: 200px;backgroun ...
- 关于Echarts柱状图点击事件的实现方法
开发过程中,我们经常会碰到这样的需求:在柱状图上,点击某条柱形,调用相应的方法或跳转相应的界面 接下来就详细介绍如何实现柱状图的点击事件,其中maChart是绘图对象 一.简单的点击事件 myChar ...
- 【小程序】bindconfirm点击小键盘触发事件、focus自动获取焦点
最近在写小程序,项目要求写一个搜索框,在进入页面时就触发input的事件,调出键盘,点小键上的搜索按钮 就触发搜索事件,分享一下. bindconfirm 是点击小键盘上的搜索按钮就触发要执行的方法 ...
- js点击按钮触发事件的方法
<!DOCTYPE html> <html> <body> <h1>My First Web Page</h1> <input id= ...
- 点击 Button触发事件将GridView1 CheckBox勾选的行添加到GridView2中
有时候想实现一个CheckBox选取功能,但是很多细节不是很清楚 相信大家都有遇到类似的情况,直接看代码,如下: 前端代码GridView1,CheckBox控件设置 <asp:GridView ...
- 在Echarts区域的任何位置精准触发事件
需求背景:点击Echarts区域跳转页面,跳转的区域不包括grid的坐标及标签,翻看了Echarts官网,实现触发事件之的on方法,但是此方法只能在鼠标点击某个图形上会触发,这样并不能实现需求.通 ...
- ztree点击加号+触发ajax请求
之前做的时候一直是点击节点才触发ajax事件,配置如下:发现点击节点前面的“+”没有反应,后来发现,应该添加一个折叠的事件. onExpand:zTreeOnClick事件和onClick的一样. v ...
- echarts添加点击事件
由于工作需要,需要用echarts 进行展示图表,却又个新的需求,要点击展示的地方,同时下面出现table展示内容 如图所示: 一开始找了好多博客,发现都不好用,大部分都是用到了 var ecConf ...
随机推荐
- Java异常处理:给程序罩一层保险
文/沉默王二 人这一生,总会遇到一些不可预料的麻烦,这些麻烦可能会让我们遭受沉重的打击.为了减轻因此承受的负担,我们就会买保险. 本着负责任的态度,我们程序员在写代码的时候,都非常的严谨.但程序在运行 ...
- Javascript sort方法
sort()方法用于对数组的元素进行排序 语法:array.Object.sort(sortBy) sortBy:可选.规定排序顺序.必须是函数 返回值:对数组的引用.数组在原数组上进行排序,不生成副 ...
- WebSocket(2)---实现游戏公告功能
实现游戏公告功能 实现功能:游戏管理里发布游戏公告,其它游戏玩家页面能够马上接受到游戏公告信息. 下面直接上代码案例,这里主要展示关键代码,底部有源码. 一.案例 1.pom.xml文件 主要是添加s ...
- Zookeeper~Linux环境下的部署
介绍 ZooKeeper是一个分布式的,开放源码的分布式应用程序协调服务,是Google的Chubby一个开源的实现,是Hadoop和Hbase的重要组件.它是一个为分布式应用提供一致性服务的软件,提 ...
- EF架构~FluentValidation实体检验与实体分离了
回到目录 在MVC,EF,LINQ环境里,我们经常会用到DataModel(DO)和ViewModel(VO),可能对于它们的属性校验我们会采用特性的方式,当然这很直观,就连微软的DEMO也是如些,一 ...
- Chapter 4 Invitations——23
The next morning, when I pulled into the parking lot, I deliberately parked as far as possible from ...
- leetcode — merge-sorted-array
import java.util.Arrays; /** * Source : https://oj.leetcode.com/problems/merge-sorted-array/ * * * G ...
- 监控mysql
Mysql服务器监控 管理MySql服务器属于应用程序监控范畴.这是因为绝大多数性能参数是有MySql软件产生的,而不属于主操作系统的一部分. 如当前所提到的,应该总是先监控基础操作系统,然后监控My ...
- ELK 经典用法—企业自定义日志收集切割和mysql模块
本文收录在Linux运维企业架构实战系列 一.收集切割公司自定义的日志 很多公司的日志并不是和服务默认的日志格式一致,因此,就需要我们来进行切割了. 1.需切割的日志示例 2018-02-24 11: ...
- JVM(一)史上最佳入门指南
提到Java虚拟机(JVM),可能大部分人的第一印象是"难",但当让我们真正走入"JVM世界"的时候,会发现其实问题并不像我们想象中的那么复杂.唯一真正令我们恐 ...