title: Multiple series, multiple charts Highcharts
body: <p>i have to create a single chart showing different series with different type of chart (Ex: one data series with 'areaspline' and one data series with 'column'). I built a db with a lot of data, extracted by sql query into a json file</p>
  
  <pre><code>[
      { "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] }
  ]
  </code></pre>
  
  <p>The json file is correct, but if i try to select the series for a chart with the $.each function it doesn't work!
  Here's my code </p>
  
  <pre><code>&lt;!DOCTYPE HTML&gt;
      &lt;html&gt;
              &lt;head&gt;
          &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;
          &lt;title&gt;Highcharts Example&lt;/title&gt;
          &lt;script src="estrazione.php"&gt;&lt;/script&gt; 
          &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"&gt;&lt;/script&gt;
          &lt;script type="text/javascript"&gt;
        $(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 &lt; 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'
                  }
              }]
          });
      });
  
  
          &lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
  &lt;script src="js/highcharts.js"&gt;&lt;/script&gt;
  &lt;script src="js/modules/exporting.js"&gt;&lt;/script&gt;
  
  &lt;div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"&gt;&lt;/div&gt;
  
      &lt;/body&gt;
  &lt;/html&gt;'
  </code></pre>
  
  <p>this is my php code:</p>
  
  <pre><code>&lt;?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);
  ?&gt;
  </code></pre>
  
  <p>I tryed any kind of option, but anything gone right :(
  Any hope to display 1 chart, 2 or more data series and 2 or more type of charts?
  Thanks in advance</p>