web-dev-qa-db-fra.com

Chart.js ajoute un remplissage aux échelles

Je dois ajouter un rembourrage sur les axes x et y. Cette question ( Comment ajouter un remplissage entre Graph et X/Y-Scale dans chart.js? ) est ma situation exacte, seulement j'utilise Chart.js 2.

Voir screeshot: http://i.imgur.com/2BvlZDg.png

Fondamentalement, mes points sont de grandes images, donc ils sont en train de s'échapper du graphique. Existe-t-il un moyen d'ajouter du rembourrage à la zone du graphique ou aux échelles pour qu'elles s'adaptent mieux?

javascriptchartschart.js
13
Joe

J'ai trouvé un moyen de le faire avec les yAxes:

options: {
    scales: {
        yAxes: [{
            ticks: {
                padding: 100
            }
        }], 
    }
}

Pas de solution pour l'instant sur l'axe x. Une solution de contournement à votre problème pourrait cependant être de définir un min inférieur en calculant le min des données et en ajoutant la soustraction d'une valeur d'incrément:

yAxes: [{
    ticks: {
        min: -100
    }
}],

Les deux togheter seraient quelque chose comme ceci: https://jsfiddle.net/u9b0nmp8/1/

Mise à jour # 1 : suggestion d'axe X

Mise à jour # 2 : alternative améliorée à l'axe des x basée sur https://stackoverflow.com/a/38620312/6638478 =

Mise à jour # 3 : la version 2.7 et supérieure prend désormais en charge le remplissage sur les axes y et x. Exemple: https://jsfiddle.net/u9b0nmp8/207/

34
Tom Glover