echarts 饼图悬浮频繁闪动

日常改bug时,发现echarts饼图鼠标悬浮上去频繁闪动,把我整的以为是后端的祸害,吓的我查来查去,最后也没找到答案,只能自己来整了,给秀儿上座,看图、看代码!

echarts闪动

1.我之前在写代码时可能是在官网复制过来的改的,就没多注意,结果还整这出,尴尬了,哈哈哈…

注:在series里的label下的show:true就可以

//这是错误的代码
emphasis: {
	label: {
		show: false,//别整false,否则会出错
	}
},
2.这是已解决的代码
emphasis: {
	label: {
		show: true,//改为true就可以了
	}
},
3.看解决完之后的图

echarts2

4.全部代码

chartGraphFnc7: function () {	// 饼图 数据来源
    datafromFnc = echarts.init(document.getElementById('box3'));
     var option = {
         backgroundColor : '#ffffff',
         tooltip: {
             trigger: 'item', //数据项图形触发
             formatter: '{b}<br/> <b>{c}<b/>' // 展示格式
         },
         legend: {
             show:true,
             selectedMode:false,//取消图例上的点击事件
             bottom: '4%',
             data:dataSourcesRankingDesc,
             // data:['智慧会务','华阳','北斗','A公司','B公司','C公司','D公司','E公司','F公司','G公司',],
         },
         color:['#368cc7','#58b1d3','#8fc436', '#41b972','#279980', '#f8b741','#f0952c', '#c8551e','#da4c40', '#8f0080'],
         series: [
             {
                 name: '访问来源',
                 type: 'pie',
                 radius: ['45%', '60%'],
                 right: '20%',
                 center:['50%', '49%'],
                 startAngle: '90',
                 label: {
                    show: false,
                    position: 'center',
                    fontSize: 14,
					color: '#333A4D',
					normal: {
					show: true,
					formatter: '{b} \n ({d}%)'
					},
                 },
                 emphasis: { //就是这块惹的祸,我整的是false,就一直闪!!!!!
                     label: {
                         show: true,
                     }
                 },
                 labelLine: {
                     show: true
                 },
                 data: dataSourcesRankingData
             }
         ]
     };

     // 为echarts对象加载数据
     datafromFnc.setOption(option);
 },
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值