Ярлыки для ярлыков формата диаграммы в Chart.js

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/

EDIT: решаемые

Я нашел решение благодаря 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 + ' %'; 
        } 
       } 
      }] 
     } 
    } 
}); 

Documentation about scales

скрипку обновленных с %: Fiddle

И если вы хотите изменить текст, отображаемый в подсказках вы можете легко изменить его с помощью обратного вызова. Вы можете найти более подробную информацию здесь Tooltip Callbacks