echarts 坐标显示,悬浮显示修改

时间:2024-04-05 15:30:08

echarts 坐标显示,悬浮显示修改

  1. 坐标显示修改,以纵坐标为例
          yAxis: {
            data: that.barChartData[idIndex].Yaxis,
            axisLabel: {
              margin: 10,
              fontSize: fontSize,
              formatter(params) {
                var str = '';
                if (params.length > 6) {
                  params.split('').map((item, index) => {
                    str = str + item;
                    if (index % 6 === 0) {
                      if (index !== 0) {
                        str = str + '\n';
                      }
                    }
                  });
                  return str
                } else {
                  return params
                }
              },
            },
          },

echarts 坐标显示,悬浮显示修改
2. 悬浮显示修改
echarts 坐标显示,悬浮显示修改

      tooltip: {
            formatter(params) {
              return params.name + ' ' + params.value + '4分'
            },
          },

echarts 坐标显示,悬浮显示修改
3. 以柱状图为例,柱子里文字的修改

          series: [
            {
              type: 'bar',
              data: [],
              itemStyle: {
                normal: {
                  label: {
                    show: true,
                    position: 'insideRight',
                    formatter(params){
                      return params.value + '/4'
                    },
                  },
                  color: '#83bff6',
                },
              },
              max: 4,
            },
          ],

echarts 坐标显示,悬浮显示修改

各部分通过formatter(params){ return params.value + '/4' },进行的改变