0

我正在尝试使用 Multiple RadialBars 图表显示 3 个百分比,以及中间的“总”平均百分比。可以在此处找到此图表的文档:https ://apexcharts.com/vue-chart-demos/radialbar-charts/multiple-radialbars/

我的问题是图表如何显示“总计”值。我希望这个值保留两位小数,但它保留完整的浮点值。我附上了一张图片来详细说明。 RadialBar 长百分比

我知道这个问题可以通过使用格式化程序来解决,并且只需使用 .toFixed(2) 方法。但是,我似乎无法弄清楚该图表的格式化程序。在不使用格式化程序的情况下,默认行为会找到所有三个百分比的平均值(如上所示)。不幸的是,该文档没有详细说明如何自定义格式化程序功能。

var efficiencyOptions = {
    series: [],
    chart: {
        height: 350,
        type: 'radialBar',
    },
    plotOptions: {
        radialBar: {
            dataLabels: {
                name: {
                    show: true,
                    fontSize: '22px',
                },
                value: {
                    show: true,
                    fontSize: '16px',
                },
                total: {
                    show: true,
                    label: 'Total',
                    // formatter function goes here
                    formatter: function (w) {
                       // Need to find average of three percentages and fix to two decimal places
                    }
                }
            }
        }
    },
    colors: ['#1ab7ea', '#0084ff', '#39539E'],
    labels: ["Laser 1", "Laser 2", "Laser 3"],
};

如果有人能帮我弄清楚这个格式化程序功能,将不胜感激。非常感谢您提前。

4

1 回答 1

0

value: {
                                formatter: function(val) {
                                    return parseInt(val);
                                },
                                color: '#111',
                                fontSize: '36px',
                                show: true
                            },

于 2020-12-21T07:32:43.563 回答