echart-環形圖-取消或改變滑鼠以上效果,取消環形圖滑鼠以上變大和標籤浮框顯示
阿新 • • 發佈:2020-07-17
用了echart搭建完專案,專案經理說滑鼠一移上去老閃(顯示浮框資訊和環形圖變大)讓去了
這邊看了api發現竟然沒有相關文件,最後自己慢慢嘗試和參考各種api後改了,總結如下:
hoverAnimation:false
取消掉環形圖滑鼠移上去時自動放大,這個要設定在series裡才會生效,而且api沒hoverAnimation
series: [ { hoverAnimation:false, name: '狀態', type:'pie', radius: ['34%', '46%'], x:'-45%', label: {show:false}, data: [ {value: 10, name: '電流', // selected: true,//環形圖開口itemStyle: { color: "#a4cdee", }, }, {value: 12, name: '溫度', itemStyle: { color:"#5490ff", }, }, {value: 1, name: '電壓', itemStyle: { color: "#a085be", }, }, ] } ]
toolTip:{show:false}:取消浮框顯示
tooltip: {//設定滑鼠移上去後會顯示資料 -黑框浮層 show:false,//關閉滑鼠移上去後顯示浮框資訊 trigger: 'item', formatter: '{a} <br/>{b} ({d}%)'//a:頭部標題 b:單項名稱name c:值value d:百分比 },
legend:{selectedMode:false,//取消標題點選後事件-這裡顯示和隱藏指定項}
legend: { selectedMode:false,//取消標題點選後事件-這裡顯示和隱藏指定項 icon:'circle',//標題圖例的樣式--預設圓角長方體 width:100,//設定寬度超出就會縱向排列 right: 10, top:60,//lengend 距頂部距離 itemGap : 24,//上下間隔 // backgroundColor:'red',//圖例背景色 textStyle:{//文字樣式 padding:[0,0,0,10],//上右下左 調節左側小圓點到文字間距 fontSize:22, color:"#595969", // lineHeight: 56, } // data: ['線上', '離線'] },
改後事件取消
改前事件: