Incomplete display of echarts floating frame

During the development process, I encountered the problem of incomplete display of the echarts floating frame: It
Insert picture description here
can be seen that due to the large number of data items, part of the tooltip floating window is blocked. You can customize the display format by setting the formatter attribute of the tooltip property of the floating window, or modify the trigger To change the display mode.

Modify the trigger to change the display mode: change the trigger attribute axis to item and the
Insert picture description here
modified effect is as follows:
Insert picture description here

Only the value of the corresponding point is displayed.

The formatter attribute customizes the display format: the
reference code is as follows:

tooltip : {
    
    
    trigger: 'axis',
    formatter: function (params, ticket, callback) {
    
    
        console.log(params);
        var showHtm="";
        for(var i=0;i<params.length;i++){
    
    
            //x轴名称
            var name = params[i][1];
            //名称
            var text = params[i][3];
            //值
            var value = params[i][2];
            showHtm+= text+ '--' + name + ' 得分:' + value+'<br>'
        }
        return showHtm;
    }
}```

Guess you like

Origin blog.csdn.net/Beatingworldline/article/details/113249889