Поместить сумму значений в центр кольцевой диаграммы?

Я рисую эту круговую диаграмму:

используя этот код:

dxPieChart: {
    dataSource: dsAlarmsBySeverity,
    size: {
        width: 275,
        height: 150
    },
    palette: ['#FFFF00', '#FF9900', '#CC3300', '#33CC33', '#0066FF'],
    legend: {
        backgroundColor: '#FCFCFC',
        border: {
                color: 'black',
                width: .5,
                visible: true,
                cornerRadius: 10
        },
        verticalAlign: 'middle'
    },
    series: [{
        type: 'doughnut',
        argumentField: 'severity',
        valueField: 'count',
        label: {
            visible: false,
            font: {
                size: 16
            },
            connector: {
                visible: true,
                width: 0.5
            },
            position: 'columns',
            customizeText: function(arg) {
                return arg.argumentText
            }
        },
        border: {
            color: 'black',
            width: .5,
            visible: true
        },
        hoverStyle: {
            border: {
                color: 'black',
                width: .5,
                visible: true
            }
        }
    }]
}

Есть ли способ добавить сумму всех значений в центр пончика? Вот так:

 John Archer16 апр. 2019 г., 16:51
Проблема @SaravanaKumar, на которую ссылается, была закрыта. Вы можете использовать этот плагин сейчас:github.com/ciprianciurea/chartjs-plugin-doughnutlabel
 Saravana Kumar03 янв. 2014 г., 21:21
Эта функция является открытым вопросом вGitHub

Ответы на вопрос(2)

Я фактически закончил тем, что делал это:


    
    alarms

Когда это связывает диаграмму, это не 'перезаписать любой внутренний HTML, так что это прекрасно работает.

Решение Вопроса

пока открытый вопрос не будет завершен, вы можете просто нарисовать собственную сумму на самом элементе canvas.

Вам нужно будет вручную вычислить положение x / y на холсте (например, [150,100] в этом примере).

var canvas=document.getElementById("myChart");
var ctx=canvas.getContext("2d");
ctx.font="36px verdana";
ctx.fillText("76",150,100);

Ваш ответ на вопрос