我爱模板网今天在使用Echarts的时候,遇到一个问题,就是客户要求鼠标移动上去,列表项显示其他颜色,效果如下:

鼠标移上去之前

鼠标移上去之后
//设置饼状图items样式 itemStyle: { //正常状态 normal: { borderWidth:.5, borderColor:'rgba(90,165,242,1)', color:function(params) { var colorList = [ '#c3dbf3','#c3dbf3','#c3dbf3' ]; return colorList[params.dataIndex] }, shadowBlur: 1, shadowColor: 'rgba(255, 255, 255, 1)', label : { position : 'inner' }, labelLine : { show : false } }, //hover状态 emphasis:{ color:function(params) { var colorList = [ '#407cbb','#407cbb','#407cbb' ]; return colorList[params.dataIndex] } } }, animationType: 'scale', animationEasing: 'elasticOut', animationDelay: function (idx) { return Math.random() * 200; } }希望本文对大家有用!