在Chart.js中格式化條形圖的yAxis標簽

Question

我在這里查看了文檔和類似的問題，但我似乎找不到解決問題的方法。

我正在使用Chart.js v.2.1.6，並且我有一個條形圖，其百分比值存儲為數字（已經乘以100）。 我需要y軸標簽和工具提示來顯示值后面的%符號。

有人可以解釋一下這個問題嗎？

在這里你有我的代碼：

var data = {
  "labels": ["Label1", "Label2", "Label3", "Label4", "Label5"],
  "datasets": [{
    "label": "Variation",
    "data": ["56", "-82.3", "25.7", "32.2", "49.99"],
    "borderWidth": 1,
    "backgroundColor": "rgba(231, 76, 60, 0.2)",
    "borderColor": "rgba(231, 76, 60, 1)"
  }]
};

var myBarChart = new Chart($("#myCanvas"), {
  type: 'bar',
  data: data,
  maintainAspectRatio: false
});

還有一個小提琴： https ： //jsfiddle.net/tdjk3ncs/

編輯：已解決

我找到了解決方案感謝miquelarranz，找到更新的小提琴：

https://jsfiddle.net/tdjk3ncs/7/

Answer 1

如果要在Y軸的值之后添加% ，可以使用圖表配置中的比例來執行此操作。 您的代碼將如下所示：

var myBarChart = new Chart($("#myCanvas"), {
    type: 'bar',
    data: data,
    maintainAspectRatio: false,
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    // Create scientific notation labels
                    callback: function(value, index, values) {
                        return value + ' %';
                    }
                }
            }]
        }
    }
});

有關秤的文檔

小提琴更新了% ： 小提琴

如果要修改工具提示中顯示的文本，可以使用回調輕松更改它。 您可以在此處找到更多信息Tooltip Callbacks