web-dev-qa-db-de.com

Verbergen von Highchart - X - Achsen - Datenwerten

Ich zeichne ein Balkendiagramm mit highchart.js

Ich möchte die Datenwerte der x-Achse nicht anzeigen.

Kann mir jemand sagen, welche Option es tut?
vollständige Konfiguration:

var chart = new Highcharts.Chart({
                chart: {
                    renderTo: container,
                    defaultSeriesType: 'bar'
                },
                title: {
                    text: null
                },
                subtitle: {
                    text: null
                },
                xAxis: {
                    categories: [''],
                    title: {
                        text: null
                    },
                    labels: {enabled:true,y : 20, rotation: -45, align: 'right' }

                },
                yAxis: {
                    min: 0,
                    gridLineWidth: 0,
                    title: {
                        text: '',
                        align: 'high'
                    }
                },
                tooltip: {
                    formatter: function () {
                        return '';
                    }
                },
                plotOptions: {
                    bar: {
                        dataLabels: {
                            enabled: true
                        },
                        pointWidth: 35,
                        color: '#D9CDC1'
                    }
                },
                legend: {
                    enabled: false
                },
                credits: {
                    enabled: false
                },
                series: [{
                    name: 'Year 1800',
                    data: [107]
                }]
            });
javascriptjquerychartshighchartsbar-chart
47
Nurul Asad

In HighCharts werden in Balkendiagrammen invertierte Achsen verwendet, sodass die untere Achse tatsächlich die Y-Achse ist. (Siehe auch "Säulendiagramme", bei denen die Grafik um 90 Grad gedreht wird. In diesem Fall ist die untere Achse die X-Achse.)

Sie müssen der yAxis-Konfiguration Folgendes hinzufügen

labels:
{
  enabled: false
}

Das vollständige Beispiel finden Sie im Folgenden: http://jsfiddle.net/k5yBj/433/

83
Nick

Um Beschriftungen auf der X-Achse auszublenden, setzen Sie die Option labels: {enabled:false} so was:

    .....
    ........
    ,
                    xAxis: {
                        categories: [''],
                        title: {
                            text: null
                        },
                        labels: {
                         enabled:false,//default is true
                         y : 20, rotation: -45, align: 'right' }

                    }


.....
....

Um Beschriftungen auf der y-Achse auszublenden, setzen Sie die Option labels: {enabled:false} so was:

.....
.......
,
                yAxis: {
                    min: 0,
                    gridLineWidth: 0,
                    title: {
                        text: '',
                        align: 'high'
                    },
                    labels:{
                        enabled:false//default is true
                    }
                },
.........
......

Siehe Dokumentation zum besseren Verständnis.

20
Rahul Gupta

Die obige beliebte Antwort verbirgt nur die Bezeichnungen, dies hinterließ für mich Häkchen, die ich ebenfalls entfernen wollte.

In diesem Fall funktioniert das gut

    xAxis: {
            visible: false
        },

Dies ist eine einfache Lösung, um für alle Interessierten alles auf der x/y-Achse zu entfernen. Weitere Informationen finden Sie hier https://api.highcharts.com/highcharts/xAxis.visible

3
RS3

Wenn Sie x Daten verstecken, schauen Sie sich diese an https://jsfiddle.net/anrilafosel/3g4z5kc3/

chart.xAxis[0].setCategories(newCategories);
for (i = 0; i < chart.series.length; i++) {
  var newData = [];
  for (j = 0; j < toggler_hc13.length; j++)
    if (toggler_hc13[j] === 1)
      newData.Push(series_hc13[i].data[j]);
  chart.series[i].setData(newData);
}
0
23 45