and - Highcharts: asegúrese de que el valor de y-Axis 0 esté en la parte inferior del gráfico
highcharts yaxis line (8)
Estoy produciendo una serie de gráficos altos en una página. En algunos casos, todos los datos para el período de tiempo especificado pueden regresar con 0 valores.
En tal caso, el gráfico se ve así: http://jsfiddle.net/charliegriefer/KM2Jx/1/
Solo hay una etiqueta de 1 eje y, 0, y está en el centro del gráfico.
Me gustaría forzar ese valor de 0 para que el eje y esté en la parte inferior del gráfico, lo que sería coherente con otros gráficos en la página que sí tienen datos.
He probado varias propiedades de yAxis, como "min: 0", "minPadding: 0", "maxPadding: 0", "startOnTick: true".
Parece que debería ser bastante sencillo, pero estoy perdido :(
Código relevante de yAxis:
yAxis: {
min: 0,
minPadding: 0,
startOnTick: true,
title: {
text: ""
}
},
Aquí hay una solución que se me ocurrió que no requiere ningún preprocesamiento de los datos y simplemente permite que los Highcharts lo hagan, como solía hacerlo antes de la actualización. http://jsfiddle.net/QEK3x/
if(chart.yAxis[0].dataMax === 0)
{
chart.yAxis[0].setExtremes(0, 5);
}
Solo necesita verificar el primer eje de la serie, como si el primero no fuera 0, entonces el problema no ocurrirá. Es posible que envíe una solicitud de extracción para esto a los gráficos altos, aunque por alguna razón siento que estaban destinados a esta funcionalidad.
Desde Highcharts 5.0.1, también puedes usar softMax.
softMax: Número
Un máximo suave para el eje. Si el máximo de datos de la serie es mayor que este, el eje permanecerá en este máximo, pero si el máximo de datos de la serie es mayor, el eje se flexionará para mostrar todos los datos.
yAxis: {
min: 0,
softMax: 100,
...
}
Aquí hay un ejemplo con un gráfico de columnas: http://jsfiddle.net/84LLsepj/
Tenga en cuenta que actualmente, en Highcharts 5.0.7, no parece funcionar para todos los tipos de gráficos. Como puede ver en este otro jsfiddle , no funciona con el gráfico de líneas.
He encontrado otra solución (y muy simple):
Puede establecer la propiedad minRange eje minRange :
yAxis: {
...
minRange : 0.1
}
Esto hace que Highcharts represente los valores mínimo y máximo de YAxis cuando todos los datos son 0.
ACTUALIZAR:
La corrección de Highcharts 4.1.9 también necesita:
plotOptions: {
line: {
softThreshold: false
}
}
La única forma de que lo mostrara "correctamente" era también proporcionando un valor max eje y. Creo que este es un problema de HighCharts cuando no se proporcionan elementos de datos con un valor de y. Dibuja el mejor gráfico que cree que puede.
Para Highcharts 5.xx, debería poder especificar:
yAxis: {
softMin: 0,
softMax: 1,
};
Esto no funcionará para el gráfico de líneas, que requiere que también establezca minRange en el mismo objeto de configuración que el anterior. Experimente con diferentes valores, ya que al definir, por ejemplo, minRange: 6 , se creó un rango en yAxis entre 0 y 4.
Solo agrega la opción "min"
yAxis: {
min: 0
}
También publiqué esto en el foro HighCharts, donde obtuve una respuesta que parece funcionar. Lamentablemente, esto implicará que haga un preprocesamiento de los datos antes de renderizar los gráficos para verificar todos los valores de datos "0" ... pero funcionará. Solo desearía que hubiera algo más "integrado" en HighCharts.
Entonces, después de resumir los valores "y", si obtengo 0, las propiedades del eje y deberían ser así:
yAxis: {
minPadding: 0,
maxPadding: 0,
min: 0,
max:1,
showLastLabel:false,
tickInterval:1,
title: {
text: ""
}
}
Ver: http://jsfiddle.net/KM2Jx/2/
Las teclas parecen ser las propiedades "max" y "showLastLabel".