Estoy usando apexcharts y reacciono para modelar un gráfico de precios de actualización en vivo. Como parte de este gráfico, me gustaría actualizar los límites mínimo y máximo a medida que se representan nuevos datos de la serie.

Mis pensamientos son que puedo definir el estado para los límites mínimo y máximo,

 let [min, setMin] = useState(9999) let [max, setMax] = useState(0)

establezca el estado dentro de la opción de evento actualizado de apexcharts (que se activa cuando el gráfico se ha actualizado dinámicamente con las funciones updateOptions() o updateSeries() ) cuando el último precio de la serie está por encima o por debajo del mínimo/máximo actual.

 const options = { events: { updated: function(chartContext, config) { console.log(`update called! \n chartContext: ${chartContext.data.twoDSeries}`) let yaxis = config.config.yaxis[0] let latestPrice = chartContext.data.twoDSeries[chartContext.data.twoDSeries.length - 1] if(yaxis.min > latestPrice){ setMin(latestPrice) } if(yaxis.max < latestPrice) { setMax(latestPrice) } } } },

y luego conecte los valores mínimos/máximos en la opción del eje y y devuelva el gráfico

 yaxis: { title: { text: "Live updating chart" }, labels: { formatter: val => val.toFixed(1) }, min: min, max: max } }; return <Chart type="candlestick" options={options} series={props.dataList} width = "1200" height = "600" />; };

Sin embargo, esto no funciona muy bien y el estado actualizado no se pasa de manera confiable al eje y. ¿Hay una mejor manera de hacer esto? ¡Gracias!