У меня проблема с созданием Highcharts динамически - из асинхронных вызовов ajax: иногда последующий график стирает предыдущий график из другого контейнера. Это сценарий:
1. От 6 до 8 диаграмм создаются одновременно из асинхронных данных AJAX. Каждый график присваивается динамическому массиву и уничтожается перед рендерингом:
if (charts[chID] != null) {
charts[chID].destroy();
}
Затем мы создаем диаграмму:
charts[chID] = new Highcharts.Chart(chartOptions);
Как я уже говорил, все эти диаграммы создаются одновременно из асинхронных вызовов ajax.
Проблема в том, что некоторые диаграммы отсутствуют после первого запуска ; после этого все графики отображаются правильно. Отладка кода показывает, что недостающие диаграммы фактически создаются, но затем удаляются последующими диаграммами. Скриншоты из Chrome Dev. инструменты:
Три диаграммы (4,5,6) в порядке
Затем добавляется еще один график (1) и стирается график 4:
Эти «отсутствующие» диаграммы случаются довольно нерегулярно - иногда отсутствует только одна диаграмма, иногда 2 или 3. Запуск подпрограммы во второй раз всегда решает проблему, и все диаграммы отображаются правильно. Я думаю, это потому, что массив графиков [] уже создан.
Я попытался пропустить функцию уничтожения диаграммы, изменив массив диаграммы на объект, инициировав массив диаграмм [] раньше, но ничего не помогло.
Обратите внимание, что код не генерирует никаких ошибок, не пропуская div.
Есть предложения, куда копать?
Спасибо!