echarts给图形设置绑定点击事件，点击事件会重复触发

已于 2022-04-13 10:33:36 修改
阅读量1.7k 收藏 3
点赞数 2
文章标签： vue echarts
于 2022-04-13 10:29:55 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_65376942/article/details/124142052
版权

问题：给echarts图形绑定点击事件，点击时请求后端接口发现第一次点击接口执行一次，第二次点击接口执行两次依次类推

解决：在绑定点击事件前加 myChart .off('click')防止重复点击

元气满满ya~
关注
Echarts 3D地图+scatter3D 实现鼠标点击事件
pia_ji的博客
03-31 7619
版本： echarts 5.X echarts-gl 2.X 效果图： 然后赋予点击事件 myChart.on('click', params => { console.log(params) }); 这时候问题来了： 1.点击地图区域时，点击事件不触发，未打印params（如下图 红色西藏区域） 2.点击series中配置时(scatter3D)，也就是图中小车车，点击事件出发了两次（如下图打印，我这里加的是散点图） 寻找原因： 1.地图不触发点击事件 查看源代码： }).on('cl
echarts重绘后之前的点击事件仍触发
peppa_pig的博客
02-29 605
今天用echarts的时候发现一个问题 鼠标点击不同地市触发一个事件展示该地区趋势图 （点击郑州市展示郑州地图，点击某县展示县级信息）但是后台中不管我第几次鼠标点击都会触发两次指向事件（点击市级触发了点击省和点击市的事件，点击县触发了省市县的事件） 现在贴出解决办法： myChart.off('click') // 解决点击事件调用n次的问题 // ...
Angularjs-echarts 点击事件
03-20
Angular-echarts是 wangshijun对echarts利用Angular封装的组件，github地址https://github.com/wangshijun/angular-echarts。附件只是在源码例子里上添加了点击事件。
Echarts数据条绑点点击事件
木兮兰兮
03-23 1546
第一步： echarts配置省略。。。。。。。 第二步：echarts数据值填充完成后，绑定事件，业务逻辑编写。（页面跳转测试） params参数，根据参数的值，进行相应的逻辑处理，如下所示： 第三步，结果如图所示： 起始（统计分析）： 点击数据条之后跳转相应的界面。 ...
Echarts点击事件
weixin_42079403的博客
04-09 3848
Echarts在实际业务中，肯定会有很多涉及交互，在此总结一下近期业务常用到的点击事件。
echarts 点击事件
purple_lumpy的博客
10-29 4461
echarts 点击事件，官网中既有例子也有文档。但基本是关于，点击图形（不包括空地）上的位置的点击事件。 而点击图形的点击事件，参考echarts 文档，使用click 事件即可。如下。 myChart.on('click', function (params) { console.log(params); }); 但是，当我们有tooltip 时，鼠标即使放在空地上，页面上看起...
echarts重写图例点击事件
HuLuWa1997的博客
02-10 2709
<div class="acountEchart"> <!-- 图例tab --> <ul class="tabWrap"> <li v-for="(item, index) in legendList" :key="index" :class="!item.active ? 'noBgcolor' : ''" @click="tabCilck(item)">{{ item.tab }}</
echarts饼图扇区添加点击事件的实例
11-26
在ECharts图表库中，为饼图扇区添加点击事件是一项常见的交互功能，这使得用户可以通过点击图表来触发特定的操作，如查看详情、跳转页面等。以下是一个详细的关于如何实现ECharts饼图扇区点击事件的实例解析。 首先...
echarts y轴添加点击事件_ECharts中的事件和行为
weixin_42416926的博客
02-23 1964
用户在操作 Echarts 的图表时会触发相应的事件，这些事件由开发者监听，然后回调函数做出相应的处理，可以弹出一个对话框、跳转到一个地址或者做数据下钻等等。ECharts 3 中绑定事件跟 Echarts 2 一样都是通过on方法，不同的是事件名称更加简单。ECharts 3 中，事件名称对应 DOM 事件名称，均为小写的字符串，如下是一个绑定点击操作的示例：myChart.on('clic...
echarts y轴添加点击事件_关于ECharts折线图非节点的点击事件
weixin_42492211的博客
02-23 651
详情请看官网教程前言：相信很多人有这种需求，在点击折线图非节点的时候不能触发点击事件，而官网又没有这方面的教程，只能自己默默的研究了解决方案如下:// 基于准备好的dom，初始化echarts实例var mychart = echarts.init(document.getElementById('main'));// 指定图表的配置项和数据var option = {title: {text: ...
Echarts添加蒙层(刷子)，功能: 可拉伸拖拽+触发事件
12-25
4.绑定拖拽事件。 基础文章目录如下： 文章链接：...
echarts 防止重复触发点击事件
ct1115196840的博客
12-11 1590
if(myChart._$handlers.click){myChart._$handlers.click.length = 0;}
Echarts - 图表绑定事件（事件处理）
王佳斌
08-11 3829
前言 ECharts 允许通过 on 方法来监听用户对图表的行为，且可以拿到 item 参数用以业务逻辑处理。 例如，如下 点击事件 效果图，可获取相关数据示例： 实现方法 官方文档: https://echarts.apache.org/zh/api.html#events 如下示例，可直接复制代码，以 *.html 运行查看效果图代码。 <!DOCTYPE html> <html lang="en"> <head> <meta charset=
ECharts 添加点击事件
热门推荐
养码青年
07-24 4万+
由于工作需要，需要用echarts 进行展示图表，却又个新的需求，要点击展示的地方，同时下面出现table展示内容 如图所示： 一开始找了好多博客，发现都不好用，大部分都是用到了 var ecConfig = require('echarts/config'); 其实是echats2中的。实现步骤： echart所在的div增加事件（onmousedown = “mousedown()”）
给echart图绑定click等鼠标事件
qq_36877078的博客
02-05 6199
在应用echarts的过程中，有时候需要给echarts绑定click事件 官方参考文档地址：https://echarts.apache.org/zh/api.html#echartsInstance.on myChart.on('click',function (params) { console.log('params',params) }) 此时是可以实现点击效果的，但是有个不友好的地方就是，只有点击折线图节点或者柱图柱子的时候才会触发，达不到只要点击echarts就能实现点击事件的效果，多方
echarts 点击的时候会触发2次问题解决
qq_25111883的博客
12-07 1255
echarts 点击的时候会触发2次
echarts -- 多图形点击事件
janthinasnail的博客
04-15 460
详见：https://www.makeapie.com/editor.html?c=xB1e8ZJ76W
Angular Echarts click事件绑定（重复绑定问题解决）
喵咪那个汪的博客
09-17 534
HTML <div #Floor echarts [options]="optionOfFloor"></div> TS
vue使用echarts 点击事件点击一次触发多次
柠檬麻麻
10-20 831
问题描述 现项目中需求是切换公司就要更新地图，就需要重新渲染这个echarts图，一旦重新渲染后会出现累加情况，它会根据你渲染的次数调用点击事件，即点击一次触发多次 解决方案 重新渲染之前先关闭点击事件 var myChartContainer = document.getElementById('map'); var myChartChina = this.$echarts.init(myChartContainer); myChartChina.off('click') myChartChina.set
echarts柱状图x轴绑定点击事件
最新发布
09-12
要在ECharts的柱状图中绑定X轴点击事件，你需要先创建一个ECharts实例，然后配置图表并指定相关的事件处理函数。 以下是一个简单的示例： ```javascript // 创建ECharts实例 var myChart = echarts.init(document....
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值