web-dev-qa-db-fra.com

Supprimer la ligne verticale dans le graphique js line chart

J'utilise Chart.js pour générer des cartes et je l'ai personnalisé dans une bonne mesure. Mais je ne suis pas en mesure de supprimer la ligne de grille verticale, peu importe quoi. Quelqu'un at-il rencontré une telle situation? Aide très appréciée.
enter image description here

JavaScript  

var ChartDataHome = {
        labels: ["",
            "NOV", "DEC", "JAN", "FEB",
        ],
        datasets: [{
            strokeColor: "rgba(255.255,255,1)",
            pointColor: "rgba(159,209,154,1)",
            pointStrokeColor: "rgba(255,255,255,1.00)",
            data: [4.5, 8.8, 7.5, 9.5, 7.8, 9]
        }, ]
    };

    var step = 2;
    var max = 10;
    var start = 0;
    ChartOptionsHome = {
        scaleLabel: "<%= value + ' K ' %>",
        pointDot: false,
        bezierCurve: false,
        scaleOverride: true,
        scaleSteps: 10,
        // scaleStepWidth: Math.ceil(4/2),
        scaleSteps: Math.ceil((max - start) / step),
        scaleStepWidth: step,
        scaleStartValue: start,
        scaleShowGridLines: true,
        scaleGridLineWidth: 0,
        scaleGridLineColor: "rgba(0,0,0,0.1)",
        datasetFill: false,
        animation: true,
        animationSteps: 60,
        scaleFontColor: "#ffffff",
        scaleFontSize: 14,
        scaleLineColor: "rgba(255,255,255,1)",
        datasetStrokeWidth: 6,
        responsive: true,

    }
    ChartOptions = {

    }

    if ($("#chartHome")[0]) {
        DrawTheChart(ChartDataHome, ChartOptionsHome, "chartHome", "Line");
    }
20
Thomas Sebastian

Ce qui suit s'applique à Chart.js 2. *.

Si vous ne disposez que d'un seul axe x, que les lignes de grille verticales (associées à cet axe x) soient affichées ou non, est spécifié par la valeur booléenne options.scales.xAxes[0].gridLines.display. Pour être plus précis, les options de graphique suivantes désactivent l’affichage des lignes de grille verticales pour le cas simple de l’axe des x.

options : {
    scales : {
        xAxes : [ {
            gridLines : {
                display : false
            }
        } ]
    }
}
66
xnakos

Une nouvelle option globale a été publiée avec la nouvelle version de Chart.js il y a deux jours.

var options = {
    scaleShowVerticalLines: false
}
18
JBMcClure
options : {
            scales: {
                yAxes: [{
                    gridLines: {
                        lineWidth: 0,
                        color: "rgba(255,255,255,0)"
                    }
                }]
            }
    };
Charts.js v2.0
4
Valera Checha

essayez "scaleShowGridLines" : false,

2
Atul Nar