取消饼图悬浮变大_echarts 饼图鼠标悬浮变大

最新推荐文章于 2024-10-11 08:53:11 发布

Kimser

最新推荐文章于 2024-10-11 08:53:11 发布

阅读量1.2w

点赞数 11

本文链接：https://blog.csdn.net/Kimser/article/details/108145767

版权

本文详细介绍如何使用ECharts进行图表的高级定制，包括关闭鼠标悬浮提示、禁用图例交互、调整系列图行为等，通过具体代码实例展示了如何实现这些定制效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

将以下三处注释变量置为false即可实现（亲测有效）

  tooltip: {
          show: false, // 关闭鼠标移上去后显示浮框信息
          trigger: 'item',
          confine: true
        },
        legend: {
          selectedMode: false, // 取消标题点击后事件-这里显示和隐藏指定项
          orient: 'vertical',
          left: 10,
          data: []
        },
        graphic: [{
          type: 'text',
          left: 'center',
          top: '40%',
          style: {
            text: '',
            textAlign: 'center',
            fill: '#FEB045',
            fontSize: 24
          }
        }, {
          type: 'text',
          left: 'center',
          top: '60%',
          style: {
            // text: '故障',
            textAlign: 'center',
            fill: '#fff',
            fontSize: 12
          }
        }],
        series: [
          {
            hoverAnimation: false, // 取消掉环形图鼠标移上去时自动放大
            name: '',
            type: 'pie',
            radius: ['60%', '89%'],
            avoidLabelOverlap: false,
            label: {
              show: false,
              position: 'center'
            },
            emphasis: {
              label: {
                show: false
              }
            },
            labelLine: {
              show: false
            },
            itemStyle: {
              emphasis: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
              },
              normal: {
                color: function (params) {
                  var colorList = [
                    '#FE4545', '#FEB045', '#FEDB45', '#009bff'
                  ]
                  return colorList[params.dataIndex]
                }
              }
            },
            data: []
          }
        ]