Tengo un gráfico de eCharts de tipo línea y quiero llenar el área entre la línea y el eje y . El comportamiento de relleno de área predeterminado ocurre verticalmente, el gráfico llena el espacio entre la línea y el eje x .
Sé que puedo intercambiar ejes en otras bibliotecas de gráficos, pero no parece una opción aquí en eCharts .
Estas son las opciones que estoy usando para configurar el gráfico:
const options = { tooltip: { show: false }, grid: { show: true, top: 0, bottom: 40, left: 50, right: 10, }, xAxis: { id: 'x', type: 'value', min: 0, max: 4, }, yAxis: { id: 'y', type: 'value', inverse: true, min: range?.min, max: range?.max, axisLine: { show: true }, splitLine: { show: true }, axisTick: { show: true } }, series: { type: 'line', xAxisId: 'x', yAxisId: 'y', symbol: 'none', smooth: true, connectNulls: false, // 2d array like [[1,1000], [3, 1250], ...] data: filteredData.data, lineStyle: { color: '#f00', }, areaStyle: { color: '#f00', origin: 'auto' } } };Gracias.
Ok, parece que tratar el tipo de eje y como una categoría en lugar de un valor y eliminar los límites del eje y funcionó.
yAxis: { id: 'y', type: 'category', // category and not value // y axis boundaries removed ...Resultado después de estos cambios: