echarts图表tooltip合理计算位置

2023-01-29  本文已影响0人  我有一条小黑狗

    tooltip: {

      trigger: 'axis',

      formatter: (params: any) => {

        let res = params[0].name;

        for (let i = 0; i < params.length; i++) {

          res += "<br>" + params[i].marker + params[i].seriesName + ":" + formattedAmount(params[i].data);

        }

        return res;

      },

      position: (point: any, params: any, dom: any, rect: any, size: any) => {

        let x = 0; // x坐标位置

        let y = 0; // y坐标位置

        // 当前鼠标位置

        let pointX = point[0];

        let pointY = point[1];

        // 提示框大小

        let boxWidth = size.contentSize[0];

        let boxHeight = size.contentSize[1];

        // boxWidth > pointX 说明鼠标左边放不下提示框

        if (boxWidth > pointX) {

          x = pointX + 10;

        } else { // 左边放的下

          x = pointX - boxWidth - 10;

        }

        // boxHeight > pointY 说明鼠标上边放不下提示框

        if (boxHeight > pointY) {

          y = 5;

        } else { // 上边放得下

          y = pointY - boxHeight;

        }

        return [x, y];

      }

    }

上一篇 下一篇

猜你喜欢

热点阅读