微信小程序使用echarts遇到的问题
问题1:ec-canvas出现上下滑动页面会漂移
解决方法:在标签内加 force-use-old-canvas="true"
问题2:echarts的tooltip会超出边界
解决方法:
// 1、封装的函数方法 export const setTooltipPosition = function (point, params, dom, rect, size) { // console.log(params, dom) //其中point为当前鼠标的位置,size中有两个属性:viewSize和contentSize,分别为外层div和tooltip提示框的大小 // 更改提示框的显示位置 let x = point[0]; // let y = point[1]; // size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:{contentSize: [width, height], viewSize: [width, height]} let boxWidth = size.contentSize[0]; // let boxHeight = size.contentSize[1]; // size里面此处获取不到dom的高度,值为NAN,所以下面指定了一个固定值 let boxHeight = 50; let posX = 0; //x坐标位置 let posY = 0; //y坐标位置 if (x < boxWidth) { //左边放不开 posX = 5; } else { //左边放的下 posX = x - boxWidth; } if (y < boxHeight) { //上边放不开 posY = 5; } else { //上边放得下 posY = y - boxHeight; } return [posX, posY]; }
// 2、使用方法 tooltip: { show: true, trigger: 'axis', position: setTooltipPosition, // 不超出边界 },