2012-09-12 4 views
14

In Highcharts möchte ich ein Flächendiagramm mit 2 Farben füllen, positive Werte erhalten eine Farbe, negative Werte erhalten eine andere Farbe. Ich konnte dies mit einer linearGradient tun, aber dies muss basierend auf der size of the container angepasst werden.Highcharts Flächendiagramm, 2 Füllfarben über/unter X-Achse verwenden

Gibt es einen allgemeineren Weg, dies zu tun, z.B. Einstellwerte>0 color 1, values < 0 color 2?

meine JSFiddle Weitere Informationen finden und ein Beispiel: http://jsfiddle.net/GNvur/2/

+0

Ich denke Ihre Lösung mit linearGradient ist für dieses Problem relevanter. Sie müssen keine Dummy-Serie erstellen. Ich würde gerne Highcharts-Beamte dazu kommentieren. – Guian

Antwort

13

Der Parameter, den wir gesucht haben wird negativeColor benannt. Verwenden Sie es in einem Bereich serie wie folgt aus:

series: [{ 
     type:'area', 
     data:chartValues, 
     color: "#FF0000", 
     threshold: 0, 
     negativeColor: '#00FFFF', 

     marker : { 
      enabled: true 
     } 
    }] 

sehen das Ergebnis in diesem JSFiddle.

+0

Sehr gut die beste Antwort, das einzige Problem, das ich jetzt finde, ist, dass wenn die Zeile unter 0 fällt, es merkwürdig wird (ein Wert wird jede Sekunde wie im Beispiel auf der Website hinzugefügt: http: //www.highcharts. com/demo/dynamic-update). Weißt du, wie das zu beheben ist? – Manuel

+0

Ich habe eine Frage zu dem oben genannten Problem gestellt: http://StackOverflow.com/Questions/16833912/graph-sliding-strangely-with-negativecolor-activated – Manuel

Verwandte Themen