echarts,tooltip让显示提示框左右不超出屏幕,提高层级。

    tooltip: {
                  
                    trigger: 'axis',
                
                   appendToBody: true,
                   position: function(point, params, dom, rect, size) {
                        // point: 鼠标位置 [x, y]。
                        // params: 与当前鼠标位置相关的数据信息对象。
                        // dom: tooltip 的 DOM 节点。
                        // rect: 绑定了 tooltip 的图形的包围盒。
                        // size:  包括 size.contentSize 和 size.viewSize,其中每个都是 [width, height] 形式的数组。
                        // 返回值是 [x, y] 形式的数组,表示 tooltip 的位置。

                        // 以下代码确保 tooltip 不会超出边界
                        var result = [point[0], point[1]];
                        if (result[0] + size.contentSize[0] > size.viewSize[0]) {
                            result[0] = size.viewSize[0] - size.contentSize[0];
                        }
                        if (result[1] + size.contentSize[1] > size.viewSize[1]) {
                            result[1] = size.viewSize[1] - size.contentSize[1];
                        }
                        return result;
                    },
                   extraCssText: 'z-index:999'
                    //confine: true,
                    
                },

echarts,tooltip让显示提示框左右不超出屏幕,提高层级。_第1张图片

你可能感兴趣的:(echarts,前端,javascript)