0
322
VistasCómo hacer un ancho fijo para todas las barras en el ancho de la columna de la barra de apexcharts
Dado que estamos utilizando datos dinámicos, la longitud de los datos también debe ser dinámica. Por ejemplo, si la longitud de los datos es 24, el ancho de la columna debe ser de 35 px. si los datos tienen una longitud de 2, ese tiempo también el ancho de la columna debe ser de 35 px.
apexchart usando columnWidth en porcentaje, por lo que no puedo especificar el ancho exacto para todas las barras en todas las condiciones si hay 1 barra, 5 barras, 30 barras. funciona como un comportamiento de respuesta, pero quiero que tenga un ancho fijo para todas las barras
Quiero que columnWidth se arregle con el primer tamaño de imagen cuando también hay 1 datos. vea en el segundo gráfico que el ancho de la columna se muestra más grande que el anterior. así que quiero arreglar todas las barras en todos los casos.
Usando: importar ApexCharts desde "react-apexcharts"; "reaccionar-apexcharts": "^1.3.6",
1 Respuestas
Responde la pregunta0
En ApexCharts, no hay opción para dar columnWidth en píxeles. Tal vez pueda intentar establecer el ancho porcentual en función del número de categorías presentes. No será 100% preciso, pero podría resolver el propósito.
Con el ancho del gráfico (w), una serie de datos (n) y el ancho de columna deseado en px (x), puedo obtener el ancho en porcentaje con esta función:
const getPercentWidth = (w, n, x) => { const percentWidth = Math.round((x / (w / n)) * 100) return `${percentWidth}%` }Puede verificar este problema en su repositorio de github para obtener más opciones en el futuro.