Highcharts - Daten, Etikett abgeschnitten

Nahm ich eine Probe jsfiddle und modifiziert es hier nur um zu zeigen, ein Beispiel, was ich erlebt habe:
http://jsfiddle.net/pMwuv/

Hier ist, was meine eigentliche datalabel-code sieht wie folgt aus:

dataLabels: {
enabled: true,
align: 'left',
verticalAlign: 'top',
style: {
    color: 'black'
},
formatter: function () {
    if (this.x == 19) {
        return this.y + '<br>units left';
    };
}
}

Was ich habe auf meinem Flächendiagramm ist, dass die letzten Daten, Etikett ist abgeschnitten. Gibt es eine Möglichkeit, erhöhen Sie die Breite des Containers oder fügen Sie irgendeine Art von Polsterung so, dass das vollständige Etikett zeigt?

Nur die änderung der x-und y-position der Beschriftung wird nicht die Arbeit für meinen Bereich Grafik. Ich habe mein Diagramm so anpassen, dass nur der Letzte Punkt der Karte hat ein Typenschild, und ich will es rechts ausgerichtet, der Letzte Punkt und nicht im Diagramm.

Aber wenn wir das obige Beispiel, Geige zu arbeiten, dann die gleiche Lösung sollte für mich arbeiten.

InformationsquelleAutor Gabriel | 2013-07-25

  1. 3

    Können Sie hinzufügen marginRight zu chart wie diese:

    chart: {
           renderTo: container,
           width: 550,
           marginRight: 35 
}

    jsFiddle.

    Beide marginRight und spacingRight zu funktionieren scheint! Ist es eine situation, wo es besser ist, das eine oder andere?
    Ja, es gibt Situationen, wenn spacingRight ist besser. Zum Beispiel, wenn Sie haben, die Legenden auf der rechten Seite. spacingRight ist ein Raum zwischen der rechten Kante der Grafik und dem gesamten Inhalt (darunter auch Legenden). marginRight ist die Marge zwischen dem rechten äußeren Rand des Diagramms und der plot area. Also, wenn Sie gelten marginRight für Diagramm mit Legende auf der rechten Seite, haben Sie einen Raum zwischen Legende und die Zeichnungsfläche. Aber in deinem Fall ist es egal.
    danke für die Erklärung!

    InformationsquelleAutor Alex P

  2. 0

    Dies ist nicht eine direkte Lösung, aber ich schlage vor, Sie setzen das label in den yAxis:

        yAxis: {
        title: {
            text: 'Units left'
        }
    },

    Entfernen und die anderen Attribute, so dass nur enabled: true:

        plotOptions: {
        series: {
            dataLabels: {
                enabled: true
            }
        }
    },

    Finden Sie die Geige

    InformationsquelleAutor falsarella

  3. 0

    Können Sie festlegen, spacingRight und fügen Sie richtigen Wert.

    InformationsquelleAutor Sebastian Bochan

Schreibe einen Kommentar