Я использую angular-chart.js (который использует Chart.js) для создания диаграмм в моем угловом приложении. Я хочу добавить значения поверх столбцов гистограммы. Если расширение диаграмм по умолчанию в Chart.js является единственным способом, не могли бы вы предоставить справочный код?
Как добавить метки индекса (поверх гистограмм) в Chart.js
Ответы (2)
Вы можете использовать ответ здесь как отображать значения данных на Chart.js и немного измените функцию обратного вызова, чтобы отображались значения индекса вместо значений
...
this.datasets.forEach(function (dataset) {
dataset.bars.forEach(function (bar, i) {
ctx.fillText(i + 1, bar.x, bar.y - 5);
});
})
...
Обратный вызов можно передать через параметр angular-chart options. Вы не будете расширять тип диаграммы, поэтому вам не нужно будет регистрировать новую директиву с angular-chart.
Скрипт — http://jsfiddle.net/zkqu7tsp/
person
potatopeelings
schedule
25.08.2015
Не могли бы вы расширить ответ, чтобы показать, как передать обратный вызов через параметр параметров угловой диаграммы?
- person aplon; 26.05.2016
Это обратный вызов onAnimationComplete для параметров угловой диаграммы.
onAnimationComplete: function () {
var chart = this.chart;
var ctx = this.chart.ctx;
this.datasets.forEach(function (dataset) {
dataset.bars.forEach(function (bar, i) {
console.log(bar)
ctx.fillText(bar.value, bar.x, bar.y - 5);
});
})
Надеюсь, это поможет вам.
person
Santhosh Racha
schedule
18.01.2017