簡體   English   中英

如何在圖表餅中添加“%”(chartjs)

[英]how to put “%” in chart pie (chartjs)

我需要在圖表中的數字后加上%:

喜歡:100%

在此處輸入圖片說明

這是我使用圖表js制作圖表的代碼:

new Chart(document.getElementById("pie-chart-one"), {
    type: 'doughnut',
    data: {
        labels: ['Transmitidas', 'Não Transmitidas'],
        datasets: [{
            data: [@Model.PorcentQtdDeclaracoesStatusTransmitida, @Model.PorcentQtdDeclaracoesStatusNaoTransmitida],
            backgroundColor: backgroudColor,
            borderWidth: 1,
        }]
    },
    options: {
        legend: {
            display: true,
            position: 'bottom',
            fontSize: 10

        },
       responsive:false,
       fontsize: 11,
       layout: {
           padding: {
               left: 0,
               right: 0,
               top: 30,
               bottom: 30
           }
        }
    }
});

在選項定義中...

options: {
        tooltips: {
            enabled: true,
            mode: 'single',
            callbacks: {
                label: function(tooltipItems, data) { 
                    return tooltipItems.yLabel + ' %';
                }
            }
        },
 } 

我使用工具提示中的回調和標題解決了這個問題:

options: {
        tooltips: {
            callbacks: {
                label: function (tooltipItem, data) {
                    var dataset = data.datasets[tooltipItem.datasetIndex];
                    var total = dataset.data.reduce(function (previousValue, currentValue, currentIndex, array) {
                        return previousValue + currentValue;
                    });
                    var currentValue = dataset.data[tooltipItem.index];
                    var percentage = Math.floor(((currentValue / total) * 100) + 0.5);
                    return percentage + "%";
                },                    
                title: function (tooltipItem, data) {
                    return data.labels[tooltipItem[0].index];
                }
            }
        }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM