echarts 饼图移动端_【前端】echarts pie饼图如何默认悬浮

本文探讨了如何使ECharts饼图在移动端初始化时即显示悬浮效果,而不是仅在鼠标移上时激活。通过设置配置项selected为true,并结合dispatchAction方法,实现了饼图元素的默认选中与高亮。同时,文章提供了相关的代码示例以供参考,解决了部分读者遇到的相同问题。
摘要由CSDN通过智能技术生成

如何让echarts的饼图初始化就显示这种悬浮的效果,

现在只能鼠标移上去才有效果。

有没有个配置项呢?求教各位大神!急!

加了一个配置项

selected:true

会出现下面的情况

回答

let currentIndex = 0;

setTimeout(function() {

currentIndex--;

var dataLen = gradeOption.series[0].data.length;

// 取消之前高亮的图形

gradeEchart.dispatchAction({

type: 'downplay',

seriesIndex: 0,

dataIndex: currentIndex

});

currentIndex = (currentIndex + 1) % dataLen;

// 高亮当前图形

gradeEchart.dispatchAction({

type: 'highlight',

seriesIndex: 0,

dataIndex: currentIndex

});

}, 100);

$("#showEchart").mouseenter(function() {

gradeEchart.dispatchAction({

type: 'downplay',

seriesIndex: 0,

dataIndex: currentIndex

});

});

$("#showEchart").mouseleave(function() {

gradeEchart.dispatchAction({

type: 'highlight',

seriesIndex: 0,

dataIndex: currentIndex

});

});

写在option后面 gradeOption即你定义的option

Echarts3里有很好的例子,当然是使用事件,点这里

加上这几个你试试

myChart.dispatchAction({

type: 'downplay',

seriesIndex: 0,

dataIndex: 0

});

myChart.dispatchAction({

type: 'highlight',

seriesIndex: 0,

dataIndex: 0

});

myChart.dispatchAction({

type: 'showTip',

seriesIndex: 0,

dataIndex: 0

});

data:[

{value:335, name:'直达', selected:true},

{value:679, name:'营销广告'},

{value:1548, name:'搜索引擎'}

]

echarts上有个例子可以看下.

请问解决了吗,我也遇到了这样的问题

请问解决了吗?我也需要这种效果…

+1 遇到过同样的问题 没有解决。。。

我想知道这种效果是怎么做的,方便教我一下吗

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值