Echarts 折线图自定义悬浮窗tooltip，读取params中的数据将小数显示为百分比并保留两位小数，日期只显示年月日

本文介绍: Echarts 折线图自定义悬浮窗tooltip，读取 params中的数据将小数显示为百分比并保留两位小数，日期只显示年月日，纵轴为百分比，横轴为年月日

在网上没有找到我需要的内容，悬浮窗数据一直显示为[Obje ct,Object]，获取不到params中的相应内容。

{treeMapData=[{yield=0.9894, time_info=2021-01-01 00:00:00}, 
{yield=1, time_info=2021-01-02 00:00:00}, 
{yield=0.9914, time_info=2021-01-03 00:00:00},
{yield=1, time_info=2021-03-31 00:00:00}]}

传到前台的数据可以用console.log(params);进行查看

Echarts上有类似的案例 Examples – Apache ECharts

其tooltip的设置为

tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'cross',
          animation: false,
          label: {
            backgroundColor: '#ccc',
            borderColor: '#aaa',
            borderWidth: 1,
            shadowBlur: 0,
            shadowOffsetX: 0,
            shadowOffsetY: 0,
            color: '#222'
          }
        },
        formatter: function (params) {
          return (
            params[2].name +
            '&lt;br /&gt;' +
            ((params[2].value - base) * 100).toFixed(1) +
            '%'
          );
        }
      },

我出现了程序错误，悬浮窗直接不显示了。

多次试错，通过控制台输出数据，最终尝试出了一个较为复杂的显示方法。

最终的tooltip为

tooltip: {
    trigger: "axis",
    axisPointer: {
        type: "cross"
    },
    formatter:function (params){
        var result="";
        var time_info="";
        var yield="";
        for (var i = 0, l = params.length; i < l; i++) {
            time_info = echarts.format.formatTime("yyyy-MM-dd", params[i].value[params[i].dimensionNames[1]]);
            yield = (params[i].value[params[i].dimensionNames[0]]*100).toFixed(2) + "%";
            result += time_info + "</br>" + yield;
            //console.log("时间",time_info);
            //console.log("良率",yield);
            //console.log("时间",params[i].value[params[i].dimensionNames[1]]);
            //console.log("良率",(params[i].value[params[i].dimensionNames[0]]*100).toFixed(2) + "%");
        }
        return result;
    }	
},

x轴和外轴为

xAxis: {
    type: "time",
    boundaryGap: false,
    axisPointer: {
        label: {
            show: true,
            formatter: function(params) {
                return echarts.format.formatTime("yyyy-MM-dd", params.value);
            }
        }
    }
},
yAxis: {
    type: "value",
    min:0.7,
    max:1,
    axisLabel: {
        formatter: function (value, index) {
            return (value * 100).toFixed(2) + "%";
        }
    },
    axisPointer: {
        label: {
            formatter: function (params) {
                return ((params.value) * 100).toFixed(2) +  "%";
            }
        }
    }
},