页面树结构
转至元数据结尾
转至元数据起始

(此文档仅供参考)

问题1:

横条图原始数据项标签如下截图,希望左边的数据项标签显示为正值:

 

解决方案

可以参考以下扩展属性去实现:

 {
    "series": [{},{
        "label": {
            "normal": {
                "show": true,
                "textStyle": {
                },
                "formatter": "function(params){return params.value[0]*-1;}"


            }
        }
    }]
}

实现效果如下:


实现数据标签(label)效果后,如何在横条图中继续实现左边的数据提示(tooltip)显示为正值:可以参考以下扩展属性去实现:

1
2
3
4
5
6
7
8
9

{
    "tooltip": {
        "trigger": 'axis',
        "axisPointer": { // 坐标轴指示器,坐标轴触发有效
            "type": '' // 默认为直线,可选为:'line' | 'shadow'
        },
        "formatter": "function(params) { return params[0].seriesName + ' : ' + Math.abs(params[0].value[0]);}"
    }
}

实现效果如下:


问题2:

柱图原始数据项标签如下截图,希望数据项标签均显示为正值:

image2022-11-11_18-41-12.png

解决方案

可以参考以下扩展属性去实现:

{
    "series": [{
        "label": {
            "normal": {
                "show": true,
                "textStyle": {},
                "formatter": "function(params){if(params.value[1]>=0) {return params.value[1];} else return params.value[1]*-1;}"
            }
        }
    }]
}


实现效果如下:

image2022-11-11_18-42-42.png


  • 无标签