当前位置: 首页 > news >正文

【Antv G2 5.x】饼图添加点击事件,获取当前坐标数据

在这里插入图片描述
在这里插入图片描述

      // 监听 tooltip:show 事件
      this.chart.on('tooltip:show', (event) => {
   
        this.currentShowTooltipName = event.data.items[0].name
      })

      // 监听绘图区plot的点击事件
      this.chart.on('interval:click', ev => {
   
        this.$emit('chartClick', this.currentShowTooltipName);
      })

      // 监听绘图区label的点击事件
      this.chart.on('label:click', ev => {
   
        this.$emit('chartClick', this.currentShowTooltipName);
      })

[
  {
   
    "title": "APP",
    "value": "292"
  },
  {
   
    "title": "门户",
    "value": "304"
  },
  {
   
    "title": "小程序",
    "value": "924"
  }
]
<template>
  <div class="pie-chart" ref="pie-chart"/>
</template>

<script>
import {
     Chart} from 
http://www.dtcms.com/a/14264.html

相关文章:

  • Docker 网络的几种常见类型
  • 【腾讯地图】录入经纬度功能 - 支持地图选点
  • MYSQL的管理备份
  • SpringBoot里,什么是状态机?在商城系统的订单管理业务上如何应用?
  • golang下载安装图文教程(Linux环境)
  • 机器学习 - 理论和定理
  • 前端骨架怎样实现
  • 【DeepSeek】DeepSeek概述 | 本地部署deepseek
  • DeepSeek笔记(一):本地部署DeepSeek R1并搭建Web UI实现可视化交互的笔记
  • 开源模型应用落地-Qwen1.5-MoE-A2.7B-Chat与vllm实现推理加速的正确姿势(一)
  • GPT 系列模型发展史:从 GPT 到 ChatGPT 的演进与技术细节
  • STM32 裸机 C编程 vs micropython编程 vs linux python
  • 【Linux】网络基础
  • 西安电子科技大学考研成绩2月24号即可查询,成绩查询入口:
  • Spring Boot比Spring多哪些注解?
  • 漏洞挖掘 | 基于mssql数据库的sql注入
  • Linux(Centos 7.6)命令详解:head
  • 安装并配置 MySQL
  • 大数据、人工智能、云计算、物联网、区块链序言【大数据导论】
  • Repo命令使用
  • 【Elasticsearch】token filter分词过滤器
  • MongoDB 扩缩容实战:涵盖节点配置、服务启动与移除操作
  • Centos7安装Tesseract5.5.0+SpringBoot集成部署(离线版)
  • 初识计算机网络
  • 企语企业管理系iFair(F23.2_a0)在Debian操作系统中的安装
  • 在Mac M1上面安装Miniconda
  • 【AI】在Ubuntu中使用docker对DeepSeek的部署与使用
  • 【Android开发】安卓手机APP拍照并使用机器学习进行OCR文字识别(完整工程资料源码)
  • Python 识别图片和扫描PDF中的文字
  • Elasticsearch+Logstash+Kibana可视化集群部署