Estoy creando un gráfico similar al ejemplo de carga diferida de Highcharts en el que estoy recuperando datos de mi servicio back-end cada vez que el usuario hace zoom arrastrando el mouse o interactuando con el navegador. Hacer clic en los botones del selector de rango también funciona correctamente, pero el problema con el que me encuentro es que los botones no están deshabilitados mientras se carga mi gráfico, ya que los datos tardan un tiempo en cargarse debido a la naturaleza de mi backend, esto significa que los usuarios pueden hacer clic en los otros botones tantas veces como quieran.

Esto conduce a múltiples llamadas al back-end que, en última instancia, estropea la forma en que se muestra el gráfico. Por ejemplo, puedo hacer clic en la opción "1y" y luego en "1d". Dado que la vista "1y" tarda mucho más en cargarse, el gráfico mostrará primero los datos "1d" y luego cambiará a "1y" más tarde. Aunque cambie, el botón "1d" seguirá apareciendo como el último seleccionado.

Además de la documentación de la API de Highcharts/Highstocks, he visto muchas publicaciones en StackOverflow y en GitHub, pero no parece haber ninguna respuesta a este problema. Intenté cambiar la variable "chartOptions" así:

 rangeSelector.enabled = false;

pero esto hace que todo el gráfico se vuelva a representar cada vez, lo que también restablece la vista de mi navegador. También probé el useRef para ver si ya se ha realizado una solicitud, y para no crear una nueva si es así, pero al hacer clic en los botones del selector de rango todavía cambia la vista del gráfico aunque no envía explícitamente una llamada al back-end. La última solución que se me ocurre es crear un div que utilizo esencialmente para "bloquear" los botones selectores de rango durante la carga, pero parece una solución bastante complicada. ¿Hay algo más que deba probar? ¡Gracias!