echart点击标题弹窗显示表格内容

只记录下如何获取点击标题的事件

在option的title内,设置triggerEvent为true开启点击事件监听,cursor为pointer是为了鼠标移动到标题时,看上去要可点击。

title: [
            {
              text: title,
              triggerEvent: true, // 开启点击事件监听
              cursor: 'pointer', // 鼠标移动到标题时,将其改为手指,表示可点击
              left: 'center', 
              textStyle: {
                color: '#5470c6',
                fontSize: 14
              }
            },
            {
              text: '数量',
              left: '5%', 
              top: 30,
              textStyle: {
                fontSize: 12,
                color: '#999' // 副标题的字体颜色
              }
            }
          ]
        myChart.setOption(option, true)
        myChart.off('click')
        // 监听 click 事件
        myChart.on('click', params => {
          if (params.componentType === 'title') {
            // 在这里处理点击标题的事件
               // 你的代码...
          }
        })

如果要echart的其他地方的点击事件,打印下点击事件的参数就能够清除了。

项目名称:代表处稽查(风险偏离模型) 2024.10-至今 项目描述:项目是实现后端模型页面配置化,实现不同层级模型的依赖以及引用,主要实现华为方的合同流程审批、内容的规范审核以及资产识别统计,识别业务流程和内部控制逻辑的配置。通过算法反馈识别结果,识别其合同及资产盘点的风险。通过数据分析和流程审查,通过平台预警或者welink应用号消息推送实现预警信息提示。 开发涉及工具 :Webstorm,Git ,TortoiseGit ,CodeHub 代码仓,云龙发包平台 主要职责:负责平台前端的设计,搭建模型配置页面,基于VUE3构建前端界面逻辑,同时采用G6,AUI组件框架实现基础组件及个性化组件的开发,在开发的同时基于一些通用页面组件进行封装,从而达到复用效果 工作内容: 1.使用 vue-route 进行路由配置,根据客户提供 UI 需求使用 vue 框架及引入第三方 AUI,EChart,G6 组件实现各类表单及图表功能开发 2.与后端Java开发进行接口请求联调,通过调用不同参数进行多场景数据处理及二次组装,从而实现用户需求效果 3.通过G6实现策略树组件开发,实现不同节点的策略配置逻辑,使用Vuex状态管理进行数据处理,从而实现父子节点的数据关联,同时也可实现不同配置框间的数据联动。 4.通过aui,EChart组件实现基础组件以及多种个性化查询表单关联开发,实现表格编辑,弹窗交互,个性化查询表单交互,柱状图,圆形图开发 5.根据接口请求返回的状态码进行相应的交互提示,通过点击交互点实现路由页面的跳转, 优化文本呢容
最新发布
06-18
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值