動態添加內容

我使用javascript來顯示一系列圖表（圖形）。 JavaScript腳本從PHP腳本請求數據，然後繪製圖表並顯示它。它不需要太多時間爲一張圖表獲取數據並進行顯示，但是時間累積的很多圖表是無聊的。我想在第一個圖表準備就緒時顯示第一個圖表，然後在第二個圖表中顯示，這樣用戶就可以看到如何將這些圖表動態添加到頁面上，從而使頁面變得越來越長。動態添加內容

基本上這裏就是我：

<script> 
var i=0; 
$.getJSON('stats.php', function (data) { 
    for (chartData in data) { 
     i++; 
     var chart = new AmStockChart(); 
     dataSet.dataProvider = chartData; 
     // etc. etc. 

     $('#stats').append('div id="chartdiv' + i + '"></div>'); 
     chart.write("chartdiv" + i); 
    } 
}); 
</script> 

<div id="stats"></div>

產生約10圖之一下其他的，但問題是，顯示空白屏幕約3-5秒，然後立刻顯示所有的圖表。如果我將其限制爲只顯示一個圖形，則顯示速度要快得多。當每張圖形準備就緒時，逐漸逐一顯示這些圖形將是很好的。

UPD：這裏是jsfiddle我把測試數據和循環一次圖20次。

來源

2013-10-25 user164863

實際上是3-5秒，是取了data.Once其取出它的顯示。 Anywaz可以爲你的代碼創建一個jsfiddle – iJade

好吧，只需添加jsfiddle來發布 – user164863

好的..只是添加了一個答案與演示... – iJade

沿着這應該有助於線有些事情.....

var i = 0; 
$.getJSON('stats.php', function (data) { 
    for (chartData in data) { 
     i++; 
     setTimeout(function(index,d1){ 
      return function() { 
        var chart = new AmStockChart(); 
        dataSet.dataProvider = data[d1]; 
        // etc. etc. 

        $('#stats').append('div id="chartdiv' + index + '"></div>'); 
        chart.write("chartdiv" + index); 
      } 
     }(i,chartData), 3000*i); 
    } 
});

這裏是demo

來源

2013-10-25 19:18:50 iJade

嗯......我覺得這是非常接近，但這一個追加空divs所有相同ID – user164863

更新代碼與演示....看看 – iJade

謝謝你的幫助頁。是的，這可能是應該的。然而，我開始將這些放在我的代碼中，該代碼在數組中有多個圖表，並發現您的演示始終只顯示最後一個圖表。我修改了jsfiddle示例並將兩個圖添加到數組中。你可以在這裏看到它[鏈接]（http://jsfiddle.net/fbKSa/14/），只有最後一張圖得到重複。 – user164863

動態添加內容

回答

相關問題