2013-01-20 37 views
0

我希望使用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文件..

回答

0

这将创建其他图表。每次你想创建新的图表,你必须给我新的名称图表像我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> 
+0

感谢的好心情......我猜我真的后如何动态地从MySQL/PHP的查询得出许多图表。我会继续搜索... –

0

而不是使用许多变量,您可以将图表推送到数组。

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

然后你就可以尽量避免使用索引等