echartsx軸名稱過長,截斷+鼠標划過顯示全稱


 1 xAxis : [
 2   {
 3         triggerEvent:true,//這句很重要,沒有不會觸發事件
 4 
 5         ……
 6 
 7    }
 8 ],
 9 
10        ……
11 
12 videoChart.setOption(option);
13 
14 
15     extension(videoChart);
16     function extension(mychart) {
17            
18 //判斷是否創建過div框,如果創建過就不再創建了                       
19 var id = document.getElementById("extension");
20 if(!id) {
21     var div = "<div id = 'extension' style=\"display:none\"></div>" ;
22     $('html').append(div);
23    }
24 }
25 videoChart.on('mouseover', function (params) {
26 console.log(params);
27 if(params.componentType == "xAxis") {
28     $('#extension').css({
29         "position": "absolute",
30         "color": "black",
31         "font-family": "Arial",
32         "font-size": "14px",
33         "padding": "5px",
34         "top":"50px",
35         "display":"inline-block",
36         "z-index":"2000"
37     }).text(params.value);                                
38    $("html").mousemove(function(event) {                           
39    var xx = event.pageX - 30;
40    var yy = event.pageY + 20;
41    $('#extension').css('top', yy).css('left', xx);
42     }); 
43                           
44 } 
45 });
46 videoChart.on('mouseout', function(params) { 
47 if(params.componentType == "xAxis") {
48     $('#extension').css('display', 'none');
49  }                        
50 });

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM