2012-09-12 20 views
14

En Highcharts, me gustaría llenar un gráfico de área con 2 colores, los valores positivos obtienen un color, los valores negativos obtienen otro color. He podido hacer esto con un linearGradient, pero esto debe ajustarse según el size of the container.Gráfico Highcharts Area, use 2 colores de relleno arriba/abajo del eje X

¿Hay una forma más general de hacerlo, p. los valores de ajuste>0 color 1, values < 0 color 2?

Ver mi jsFiddle para obtener más información y un ejemplo: http://jsfiddle.net/GNvur/2/

+0

Creo que su solución con linearGradient es más relevante para este problema. no es necesario crear series ficticias. Me gustaría leer comentarios de altos directivos sobre esto. – Guian

Respuesta

13

El parámetro que buscábamos es nombrado negativeColor. Utilizarlo en un área como esta serie:

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

     marker : { 
      enabled: true 
     } 
    }] 

ver el resultado en este JSFiddle.

+0

Mucho, la mejor respuesta, el único problema que encuentro ahora es que cuando la línea va por debajo de 0 comenzará a actuar de forma extraña (se agrega un valor cada segundo como en el ejemplo del sitio web: http: //www.highcharts. com/demo/dynamic-update). ¿Sabes cómo arreglar ésto? – Manuel

+0

Publiqué una pregunta sobre el problema anterior: http://stackoverflow.com/questions/16833912/graph-sliding-strangely-with-negativecolor-activated – Manuel

Cuestiones relacionadas