web-dev-qa-db-fra.com

Masquer les axes et les lignes de la grille

J'essaie de masquer entièrement les axes et les quadrillages de mon graphique Highcharts. Jusqu'à présent, j'ai essayé de définir la largeur des lignes sur 0, mais cela n'a pas fonctionné.

xAxis: {
  lineWidth: 0,
  minorGridLineWidth: 0,
  lineColor: 'transparent'
}

Est-il possible de simplement désactiver globalement les lignes d'axe/ticks et le quadrillage pour créer un tracé "simple"?

chartshighcharts
74
alex

Il suffit d'ajouter

xAxis: {
   ...  
   lineWidth: 0,
   minorGridLineWidth: 0,
   lineColor: 'transparent',
   ...          
   labels: {
       enabled: false
   },
   minorTickLength: 0,
   tickLength: 0
}

à la définition de l'axe x.

137
dgw

Pour le yAxis, vous aurez également besoin de:

gridLineColor: 'transparent',

68
Zac Morris

Si vous avez une version plus grande que la v4.9 de Highcharts, vous pouvez utiliser visible: false dans les paramètres xAxis et yAxis.

Exemple:

$('#container').highcharts({

    chart: {
        type: 'column'
    },

    title: {
        text: 'Highcharts axis visibility'
    },

    xAxis: {
        visible: false
    },

    yAxis: {
        title: {
            text: 'Fruit'
        },
        visible: false
    }

});
25
onetwo12

vous pouvez également masquer le quadrillage sur yAxis en tant que:

yAxis:{ 
  gridLineWidth: 0,
  minorGridLineWidth: 0
}
19
Shweta Bhagwat

j'ai réussi à éteindre le mien avec juste

       lineColor: 'transparent',
       tickLength: 0
5
Ben

Si vous ne voulez pas toucher à l'objet config, il vous suffit de masquer la grille par css:

.chart-container .highcharts-grid {
   display: none;
}
2
Iran Reyes

Cela a toujours bien fonctionné pour moi:

yAxes: [{
         ticks: {
                 display: false;
                },
0
0365Chris