首页 > 解决方案 > Chart.js 如何格式化属于特定轴的数据集(我有两个 yAxes)

问题描述

我有一个带有两个 yAxes 的图表。右侧以 % 显示,但数据集的值类似于 [0.23, 0.7,..] 而不是 [23%,70%,..]。

因此,我想以百分比显示属于“百分比”轴的数据集的工具提示和标签(chartjs-plugin-datalabels),但不显示属于其他 yAxis 的数据集。我该怎么做呢?

parasails.registerComponent('chart', {

props: {

        chartData: Array,

        title: String,

        yAxes: Array

},

data: function (){

     supportedAxes: {

            percentAxis : {

                id: 'percent',

                type: 'linear',

                position: 'right',

                scaleLabel: {

                    display: true,

                    labelString: 'PERCENT',

                },

                ticks: {

                    callback: function (value) {

                        return (value * 100).toFixed(1) + '%'; // convert it to percentage

                    }

                }

            },

            hoursAxis : {

                id: 'hours',

                type: 'linear',

                scaleLabel: {

                    display: true,

                    labelString: 'HOURS'

                }

                //position: 'left'

            }



     }

},

methods: {

var options = {

plugins:{

                    datalabels:{

                        display: this.displayDatalabels

                    }

}

}

标签: javascriptvue.jslabelchart.jsmultiple-axes

解决方案


推荐阅读