ChartJS создания диаграммы Ajax

Question

Я последовал примеру на сайте chartJS и разместили следующий код в window.onload:

ctx = document.getElementById("graphcanvas").getContext("2d");  
window.myBar = new Chart(ctx).Bar(barChartData, { 
    responsive : true 
}); 

... который работает прекрасно, как когда я нажимаю мою кнопку, чтобы отобразить всплывающее окно, отображается гистограмма с фиктивными данными.

В моей функции я взял копию фиктивных данных и немного изменил ее, чтобы можно было увидеть разницу.

В моей функции у меня есть следующий код:

ctx = document.getElementById("graphcanvas").getContext("2d"); 
window.myBar = new Chart(ctx).Bar(barChartDataDiff, { 
    responsive : true 
}); 

... но по какой-то причине, когда этот код запускается всплывающее окно, ранее содержавшего моя гистограмма теперь пуст, гистограмма исчезает.

Я попытался добавить .destroy(), прежде чем воссоздать диаграмму и использовать «myBar» вместо «window.myBar», но ничего не работает.

Answer 1

Почему вы не создаете граф с фиктивными данными (скрытый при загрузке), а затем используете метод обновления диаграммы js для вставки этих данных в «barChartData»?

1. создать график, скрыть
2. chart.update() с новыми данными
3. показать граф