Midline Chart JS Line

0

I have a chart like the image below in ChartJs:

Isitpossibletodrawastraightlinethatshowstheaverageofthevaluesasintheimagebelow?

GraphicCode:

$(function(){newChart(document.getElementById("graficoOcupacao").getContext("2d"), getChartJs('line'));
});

function getChartJs(type) {

    var config = null;

    if (type === 'line') {
        config = {
            type: 'line',
            data: {
                labels: ["01", "02", "03", "04", "05", "06", "07","08","09","10","11", "12", "13", "14", "15", "16", "17","18","19","20","21", "22", "23", "24", "25", "26", "27","28","29","30"],
                datasets: [{
                    data: dadosGraficoValores,
                    borderColor: 'rgba(0, 188, 212, 0.75)',
                    backgroundColor: 'rgba(0, 188, 212, 0.3)',
                    pointBorderColor: 'rgba(0, 188, 212, 0)',
                    pointBackgroundColor: 'rgba(0, 188, 212, 0.9)',
                    pointBorderWidth: 1
                }]
            },
            options: {
                responsive: true,
                legend: false,
                scales: {
                    xAxes: [{
                        display: true,
                        scaleLabel: {
                            display: true,
                            labelString: 'Dia'
                        }
                    }],
                    yAxes: [{
                        display: true,
                        scaleLabel: {
                            display: true,
                            labelString: 'Ocupação (%)'
                        }
                    }]
                },
                title:{
                    display: true,
                    text:'NOVEMBRO/2017'
                }
            }
        }
    }
    return config;
}
    
asked by anonymous 30.11.2017 / 19:33

1 answer

0

Add the Chart.Annotation.js in your project and do:

link link

annotation: {
    annotations: [{
        type: 'line',
        mode: 'horizontal',
        scaleID: 'y-axis-0',
        value: '25',
        borderColor: 'red',
        borderWidth: 2
    }]
}

In% of graph%

    
01.12.2017 / 19:50