2016-04-07 6 views
-2

Ich möchte YAxis Wert bei Null auf Highcharts Säulendiagramm mit positiven & negativen Werten wie folgt: https://drive.google.com/open?id=0B_IZwAPijvleZzBhUnVaSFhBcDQ, diese Achsenwerte sind dynamisch geladen. Mit jqPlot gibt es eine Option namens forceTickAt0 bei Achseneinstellungen, die meine Anforderungen erfüllen kann, Ich würde gerne wissen, ob dies mit Highcharts möglich ist, wenn ja, wie? Danke.Highcharts Zentrum Yaxis Wert bei Null auf Säulendiagramm

Update: Ok, klar, um meine Frage zu erklären, ich habe eine jsFiddle erstellt. Wie Sie in der Tabelle sehen, ist der Wert der max/min-Reihe auf der y-Achse 5001/-4280, aber Highcharts zeigt 15000/-5000 an der y-Achsengrenze und ich erwarte, dass es 6000/-5000 ist, und wenn Sie entferne den ersten Wert 5001 von der Y-Achsen-Serie, Highcharts zeigt 5000/-5000 an der Y-Achsen-Grenze, was ich erwartet habe. Fügen Sie also einen 5001-Wert an der Y-Achsenreihe hinzu, da die Y-Achsengrenze zu weit entfernt wird.

Der entscheidende Punkt ist, dass ich nicht möchte, dass der größte/kleinste Serienwert auf der y-Achse zu weit vom maximalen/minimalen Grenzwert des Diagramms entfernt ist.

Nachstehend ist der Code, zur Erklärung Zweck, Serie Daten verwenden hier feste Werte, in einer realen Situation sind sie alle dynamisch geladen.

$(function() { 
    $('#container').highcharts({ 
    chart: { 
     zoomType: 'xy', 
     plotBackgroundColor: '#fffdf6', 
     alignTicks: true, 
    }, 
    title: { 
     text: 'Country Illegally Building Num Average Tax', 
    }, 
    subtitle: { 
     text: '' 
    }, 
    xAxis: [{ 
     categories: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N'], 
     crosshair: true, 
     title: { 
     text: 'Country Code', 
     } 
    }], 
    yAxis: [{ // Primary yAxis 
     labels: { 
     format: '{value} ', 
     }, 
     title: { 
     text: 'Illegally Building Num', 
     }, 

    }, { // Secondary yAxis 
     min: 0, //Required to start at zero 
     title: { 
     text: 'Average Tax ($)', 
     style: { 
      color: '#666' 
     } 
     }, 
     labels: { 
     format: '{value} $', 
     style: { 
      color: '#666' 
     } 
     }, 
     opposite: true 
    }], 
    tooltip: { 
     shared: true 
    }, 
    legend: { 
     enabled: false 
    }, 
    series: [{ 
     color: 'red', 
     negativeColor: 'green', 
     name: 'Illegally Building Num', 
     type: 'column', 
     data: [5001, 369, 475, 891, 3585, 4235, -1711, -3648, -3749, -2555, -4280, -1017, 2001, -900], 
     tooltip: { 
     valueSuffix: ' ' 
     } 
    }, { 
     name: 'Average Tax', 
     type: 'line', 
     data: [140.5, 141, 139.5, 162, 151, 142, 147, 151, 154, 142, 146, 149, 153, 111.5], 
     yAxis: 1, 
     tooltip: { 
     valueSuffix: ' $' 
     } 
    }] 
    }); 
}); 
+0

1) das min/max ist kein absolutes. Es funktioniert in Kombination mit dem * tickInterval * und dem * minPadding */* maxPadding *. In den meisten Fällen, wenn Sie das Maximum wie beschrieben einstellen, erhalten Sie eine "freundliche" max. Wenn Sie dies nicht tun, können Sie dies beeinflussen, indem Sie die Werte tickInterval und maxPadding anpassen. – jlbriggs

+0

Der max/min-Wert hängt sehr von den Rohdaten ab, und es ist schwierig, die tickInterval coz y-Achse Werte können große Unterschiede (vielleicht nur 1.000, 10.000, 100.000 oder 1.000.000 ... etc) –

+0

haben Sie versucht Einstellung ein Minimum und Maximum? wenn das nicht funktioniert, wie du willst, poste eine Geige mit Details. Haben Sie versucht, nur die Daten zu plotten und nichts anderes zu tun? Es scheint, als ob das, was Sie verlangen, normales Standardverhalten für Highcharts ist - wieder, wenn es nicht funktioniert, wie Sie wollen, postulieren Sie eine Geige mit spezifischeren Details darüber, was nicht wie gewünscht funktioniert. – jlbriggs

Antwort

1

Ich glaube nicht, gibt es eine forceiTickAt0, aber diese Funktionalität kann leicht durch Einstellung des min/max von der y-Achse erreicht werden. Zum Beispiel:

yAxis: { 
      min:-20, 
      max:20, 
      title: { 
       text: 'Axis Title' 
      }, 
      labels: { 
       formatter: function() { 
        return this.value + '°'; 
       } 
      }, 
      lineWidth: 2 
     }, 

Dies würde einen Mittelpunkt bei 0 hat, und abhängig von Ihren Daten können Sie dynamisch den max der Absolutwert des min zu sein.

+0

Bitte sehen Sie meine aktualisierte Frage, danke. –

Verwandte Themen