0
299
VistasHighcharts: ¿es posible configurar el radio del borde superior para las columnas en el gráfico de columnas?
Estoy tratando de configurar un gráfico de columnas que se vería así:
Y me gustaría redondear el radio del borde superior para las columnas.
Encontré una solución que se ve así:
plotOptions: { series: { borderRadius: 8 } },Sin embargo, el problema es que el borde en la parte inferior de las columnas también se redondea de esta manera:
Y no hay forma de pasar una cadena a ese parámetro borderRadius con varios parámetros para cada esquina, por ejemplo, borderRadius: '5px 0' . ¿Es posible configurarlo de alguna manera?
Aquí hay parte de la documentación a la que me he estado refiriendo: documentación
NOTA: hay una solución para tal problema aquí con el uso de JQuery, sin embargo, me preguntaba si es posible configurarlo en React.
1 Respuestas
Responde la pregunta0
De hecho, pude modificarlo usando este complemento highcharts-border-radius . En el componente con el gráfico de columnas, agregué la siguiente importación:
const borderRadius = require('highcharts-border-radius'); borderRadius(Highcharts); Y en el objeto de configuración que se pasa al componente HighchartsReact como accesorio de options , agregué lo siguiente:
plotOptions: { column: { pointPadding: 0.2, borderWidth: 0 }, series: { borderRadiusTopLeft: 8, borderRadiusTopRight: 8 } },Esta configuración funcionó para mí