多個系列，多個圖表Highcharts

我要創建表示不同一系列不同類型的圖表單個圖表（例如：與「areaspline」和與「列」的一個數據系列的一個數據系列）。我內置了大量數據的數據庫，通過SQL查詢提取到一個JSON文件多個系列，多個圖表Highcharts

[ 
    { "name": "Test", "data": [2.8,2.8,2.8,2.7,2.7,] }, 
    { "name": "kwc", "data": [10,1,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0] } 
]

JSON文件是正確的，但如果我嘗試選擇一系列與$。每個功能的圖表它不不行！這裏是我的代碼

<!DOCTYPE HTML> 
    <html> 
      <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
     <title>Highcharts Example</title> 
     <script src="estrazione.php"></script> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
     <script type="text/javascript"> 
     $(function() { 
      $.getJSON("new3.php", function(json) { 
      $.each(json.data, function(index, item){ 
     // split the data set into ohlc and volume 
     var temperatura = [], 
      misura = [], 
      dataLength = json.length; 

     for (i = 0; i < dataLength; i++) { 
      temperatura.push([ 
       data[i][0] 
      ]); 

      misura.push([ 
       data[i][1] 
      ]) 
     } 
     $('#container').highcharts({ 
      chart: { 
       zoomType: 'xy' 
      }, 
      title: { 
       text: 'Analisi Temperature e Consumo Generale', 
      }, 

      xAxis: [{ 
       categories: ['00.00', '00.15', '00.30', '00.45', '01.00', '01.15', '01.30', '01.45', '02.00', '02.15', '02.30', '02.45', '03.00', '03.15', '03.30', '03.45', '04.00', '04.15', '04.30', '04.45', '05.00', '05.15', '05.30', '05.45', '06.00', '06.15', '06.30', '06.45', '07.00', '07.15', '07.30', '07.45', '08.00', '08.15', '08.30', '08.45', '09.00', '09.15', '09.30', '09.45', '10.00', '10.15', '10.30', '10.45', '11.00', '11.15', '11.30', '11.45', '12.00', '12.15', '12.30', '12.45', '13.00', '13.15', '13.30', '13.45', '14.00', '14.15', '14.30', '14.45', '15.00', '15.15', '15.30', '15.45', '16.00', '16.15', '16.30', '16.45', '17.00', '17.15', '17.30', '17.45', '18.00', '18.15', '18.30', '18.45', '19.00', '19.15', '19.30', '19.45', '20.00', '20.15', '20.30', '20.45', '21.00', '21.15', '21.30', '21.45', '22.00', '22.15', '22.30', '22.45', '23.00', '23.15', '23.30', '23.45'], 
      }], 
      yAxis: [{ // Primary yAxis 
       labels: { 
        format: '{value}°C', 
        style: { 
         color: '#89A54E' 
        } 
       }, 
       title: { 
        text: 'Temperature', 
        style: { 
         color: '#89A54E' 
        } 
       } 
      }, { // Secondary yAxis 
       title: { 
        text: 'Consumo', 
        style: { 
         color: '#4572A7' 
        } 
       }, 
       labels: { 
        format: '{value} Kw', 
        style: { 
         color: '#4572A7' 
        } 
       }, 
       opposite: true 
      }], 
      tooltip: { 
       shared: true 
      }, 
      legend: { 
       layout: 'vertical', 
       align: 'left', 
       x: 120, 
       verticalAlign: 'top', 
       y: 100, 
       floating: true, 
       backgroundColor: '#FFFFFF' 
      }, 
      series: [{ 
       name: 'Misure', 
       color: '#4572A7', 
       type: 'column', 
       yAxis: 1, 
       data: misura, 
       tooltip: { 
        valueSuffix: ' Kw' 
       } 

      }, { 
       name: 'Temperature', 
       color: '#89A54E', 
       type: 'spline', 
       data: temperatura, 
       tooltip: { 
        valueSuffix: '°C' 
       } 
      }] 
     }); 
    }); 


     </script> 
    </head> 
    <body> 
<script src="js/highcharts.js"></script> 
<script src="js/modules/exporting.js"></script> 

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div> 

    </body> 
</html>'

這是我的PHP代碼：

<?php 
$data_scelta = "2013-08-08"; 
$misura = "kwc"; 
$temperatura = "Test"; 
$link = mysqli_connect('localhost:3306', 'root', '','telegestione'); 
    if (!$link)  { 
     die('Could not connect: ' . mysqli_error());} 
$sth = mysqli_query($link,"SELECT $temperatura FROM temperature WHERE dataora BETWEEN '$data_scelta 00:00:00.000' 
          AND '$data_scelta 23:59:59.997'"); 
$rows = array(); 
$rows['name'] = $temperatura; 
while($r = mysqli_fetch_assoc($sth)) { 
    $rows['data'][] = $r[$temperatura];} 
$sth = mysqli_query($link,"SELECT $misura FROM misure WHERE dataora BETWEEN '$data_scelta 00:00:00.000' 
          AND '$data_scelta 23:59:59.997'"); 
$rows1 = array(); 
$rows1['name'] = $misura; 
while($rr = mysqli_fetch_assoc($sth)) { 
    $rows1['data'][] = $rr[$misura];} 
$result = array(); 
array_push($result,$rows); 
array_push($result,$rows1); 
print json_encode($result, JSON_NUMERIC_CHECK); 
?>

我tryed任何一種選項，但任何事情走了正確的:( 任何希望顯示1個圖，2個或多個數據系列和2個或更多類型的圖表？在此先感謝

來源

2013-10-09 Ashkrimn

如果您使用$ .getJSON（「new3.php」功能（JSON）{執行console.log（JSON） ;你是什麼讓你收到任何錯誤 –

它看起來像你的highcharts creation調用是在你的$ .each函數中，所以它會嘗試創建2個highcharts，但它們都將被創建在同一個div ，s你只會得到一個。此外，你caculating數據長度的方式，這將是2.當它出現時，你想它是實際數據的長度（這是你的不同系列有所不同）。我不能做的getJSON中的jsfiddle，所以我假設你的PHP代碼創建你列出的JSON對象（它看起來像它會）。你可以失去產品總數的每個循環並設置2系列是這樣的：

series: [{ 
     name: 'Misure', 
     color: '#4572A7', 
     type: 'column', 
     yAxis: 1, 
     data: json[1].data, 
     tooltip: { 
      valueSuffix: ' Kw' 
     } 

    }, { 
     name: 'Temperature', 
     color: '#89A54E', 
     type: 'spline', 
     data: json[0].data, 
     tooltip: { 
      valueSuffix: '°C' 
     } 
    }]

http://jsfiddle.net/bhlaird/dUkuY/

來源

2013-10-09 21:18:06

它現在我必須努力實現許多系列（超過200），日期選擇器和範圍選擇謝謝你幫我在這第一步已經度過了愉快的一天？！！！ – Ashkrimn

多個系列，多個圖表Highcharts

回答

相關問題