Echarts给Y轴、tooltip添加单位

• Echarts中给Y轴加单位

   yAxis: [
                {
                    type: 'value',
                    axisLabel: {
                        formatter:'{value} 次'
                    }
                }
            ],

• Echarts中给tooltip加单位

tooltip: {
          trigger: 'axis',
          formatter: function (params) {
            var relVal = params[0].name
            for (var i = 0, l = params.length; i < l; i++) {
              relVal += '<br/>' + params[i].marker + params[i].seriesName + ' : ' + params[i].value + '(KW·h)'
            }
            return relVal
          }
        },

  tooltip: {
          trigger: 'axis',
          formatter: function (params) {
            var relVal = params[0].name
            for (var i = 0; i < params.length; i++) {
              relVal += '<br/>' + params[i].marker + params[i].seriesName + ' : ' + params[i].value + 'm³'
            }
            // relVal += '<br/>' + `<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#00CBFF;"></span>` + params[0].seriesName + ' : ' + params[0].value + '%'
            return relVal
          }
        },

折线图相关配置

image.png

配置如下：

  tooltip: {
          trigger: 'axis',
          formatter: function (params) {
            var relVal = params[0].name
            // console.log(params)
            for (var i = 0; i < params.length; i++) {
              relVal += '<br/>' + params[i].marker + params[i].seriesName + ' : ' + params[i].value + 'm³'
            }
            return relVal
          }
        },

柱状图相关配置

image.png

        tooltip: {
          transitionDuration: 0, // 提示框浮层的移动动画过渡时间，单位是 s，设置为 0 的时候会紧跟着鼠标移动。 解决窗口抖动
          trigger: 'axis',
          formatter: function (params) {
            var relVal = params[0].name
            relVal += '<br/>' + `<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#00CBFF;"></span>` + params[0].seriesName + ' : ' + params[0].value + '%'
            return relVal
          },

image.png

配置如下：

        tooltip: {
          show: true,
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          },
          transitionDuration: 0,
          formatter: function (params) {
            var relVal = params[0].name
            let marker = ['<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#00CBFF;"></span>', '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1ff1c3;"></span>']
            for (var i = 0; i < params.length; i++) {
              relVal += '<br/>' + marker[i] + params[i].seriesName + ' : ' + params[i].value + '个'
            }
            return relVal
          }
        },