He estado tratando de cargar un gráfico desde un valor seleccionado predeterminado en una lista desplegable. Este es el html para el elemento seleccionado.

 <select class="custom-select" id="activity"> <option disabled value="">Select an activity</option> <option selected value="Running">Running</option> </select>

Y luego el javascript va así.

 function loop() { setTimeout(function () { load(activities.value); loop(); }, 5000); } var activities = document.getElementById("activity"); load(activities.value);

Intenté esto y el gráfico simplemente no se carga. Pero luego probé esto

 function loop() { setTimeout(function () { load(activities.value); loop(); }, 5000); } var activities = document.getElementById("activity"); load(activities.value); loop();

 function load(activity){ graph= {"class": "go.GraphLinksModel", "nodeDataArray": [{}], "linkDataArray": [{}] } myDiagram.model = go.Model.fromJson(graph); }

Y la llamada de función inicial justo antes de loop() no carga el gráfico. Pero después de 5 segundos, una vez que el bucle se activa, el gráfico se carga . Y cada 5 segundos sigue cargándose como debería. También intenté agregar un detector de eventos onchange al menú desplegable con 2 opciones más y agregué.

 activities.addEventListener("change", () => { load(activities.value);});

y una vez que cambié de un lado a otro, los gráficos se cargaron.

También probé myDiagram.requestUpdate(); justo después de la load(activities.value); .

¿Dónde va mal? ¿Qué estoy haciendo mal?. Agradezco todos los consejos y preguntas para obtener más aclaraciones y, por supuesto, algunas respuestas si alguien puede ayudar.