在一個頁面上的多個高圖

我希望使用mysql數據呈現多個圖表，根據特定的搜索，將會有更多或更少的圖表。我已經成功創建了一個圖表，並且我的php文件很好地迴應了所需的json格式。在一個頁面上的多個高圖

現在，我想要的是能夠遍歷數組，並繪製新的圖表基於數組vales被解析到php，從而提供不同的json數據來呈現。

順便說一下，我javasript非常有限，因此在這裏不用我的代碼和想法：

<script type="text/javascript"> 
    $(function() { 
     var chart; 
     var venue = <?php echo json_encode($venue_name); ?>; /* parsed to php file */ 
     var distances = <?php echo json_encode($data); ?>; /* array to be looped over */ 
     $(document).ready(function() { 

      var options = { 
        .... 
       series: [] 
        .... 
      }; 

      // 
      $.each(distances, function() { 
       $.each(this, function(name, value) { 
       // do some ajax magic here:... 
       GET 'myphpfile.php?venue='+venue+'&'+distances 

        function drawNewChart(){ 
         $('#mainSite').append('<div id="container" style="float:left; display:inline"></div>'); 

       chart = new Highcharts.Chart(options); 
     }); 
    });   

    </script>

我學到的是，我不能循環的包括有完整的PHP和jQuery的PHP文件..

來源

2013-01-20 Steve Clarke

這將創建其他圖表。每次你想創建新的圖表，你必須給我新的名稱圖表像我chart2

粘貼這個波紋管，它會給你其他圖表。

<script type="text/javascript"> 
$(function() { 
    var chart2; 
    var venue2 = <?php echo json_encode($venue_name); ?>; /* <---use other variable here of $venue_name */ 
    var distances2 = <?php echo json_encode($data); ?>; /* <---use other variable of $data */ 
    $(document).ready(function() { 

     var options = { 
       .... 
      series: [] 
       .... 
     }; 

     // 
     $.each(distances2, function() { 
      $.each(this, function(name, value) { 
      // do some ajax magic here:... 
      GET 'myphpfile.php?venue2='+venue2+'&'+distances2 

       function drawNewChart(){ 
        $('#mainSite').append('<div id="container" style="float:left; display:inline"></div>'); 

      chart2 = new Highcharts.Chart(options); 
    }); 
});   

</script>

來源

2013-01-20 11:09:15

感謝的好心情......我猜我真的後如何動態地從MySQL/PHP的查詢得出許多圖表。我會繼續搜索... –

而不是使用許多變量，您可以將圖表推送到數組。

var charts = []; 
charts.push(new Highcharts(options));

然後你就可以儘量避免使用索引等

來源

2013-02-01 11:32:24

在一個頁面上的多個高圖

回答

相關問題