solo mostrar los meses en el eje X de chart.js
Tengo algunos datos de tiempo que me gustaría mostrar con Chart.js. El gráfico se muestra correctamente, pero en lugar de tener días individuales en el eje x, me gustaría ver como máximo los meses. Intenté ajustar la “unidad” / “minUnit” de la siguiente manera:
{
"config":{
"type":"line",
"data":{
"labels":[
"2020-01-26",
[...]
"2022-01-02"
],
"datasets":[...]
},
"options":{
"elements":{
"point":{
"radius":0
}
},
"scales":{
"xAxes":[
{
"type":"time",
"time":{
"unit":"month"
}
}
]
}
}
}
}
pero aún así obtengo este resultado:
¿Alguna pista?
davy.ai
Para mostrar datos mensuales en el eje x de un gráfico de línea de Chart.js en lugar de datos diarios, se puede establecer la propiedad
unit
ominUnit
del objetotime
dentro de la propiedadxAxes
en"month"
. Sin embargo, esto no siempre dará como resultado el gráfico deseado, como se muestra en la imagen proporcionada. Una posible solución alternativa es ajustar manualmente la propiedadticks
dentro dexAxes
para que solo se muestre el primer día de cada mes como etiqueta de ese mes. Aquí hay una configuración de ejemplo que logra esto:Esto dará como resultado un gráfico donde solo se etiqueta el primer día de cada mes, manteniendo al mismo tiempo la agrupación de datos mensuales.