传说和轴标题没有在Highcharts图中显示

我有一个显示三种不同能源成本的Highcharts图。我似乎无法让我的传说显示，也无法显示轴标题。传说和轴标题没有在Highcharts图中显示

传说应该有标题;天然气，电力，石油，他们也应该在轴心上。

的链接的jsfiddle是：

(function ($) { // encapsulate jQuery 
    $(function() { 
     var seriesOptions = [], 
      yAxisOptions = [], 
      seriesCounter = 0, 
      names = ['Electric', 'Oil', 'Gas'], 
      colors = Highcharts.getOptions().colors; 

     $.each(names, function (i, name) { 
      $(function() { 
       $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) { 
        // Create the chart 
        window.chart = new Highcharts.StockChart({ 
         chart: { 
          renderTo: 'container', 
          zoomType: 'x' 
         }, 
         legend: { 
          layout: 'vertical', 
          align: 'right', 
          verticalAlign: 'top', 
          x: 10, 
          y: 100, 
          borderWidth: 0 
         }, 
         rangeSelector: { 
          selected: 12 
         }, 
         title: { 
          text: 'Energy Prices' 
         }, 
         yAxis:[{opposite:false},{opposite:true},{opposite:true,offset:50}], 
         series: [ 
          { 
           name: 'Electric', 
           yAxis:0, 
           data: [ 
            [1072915200000, 5.73], 
            [1073001600000, 5.81], 
            [1073088000000, 5.23], 
            [1073174400000, 5.32] 
           ], 
           tooltip: { 
            valueDecimals: 2 
           } 
          }, { 
           name: 'Oil', 
           yAxis:1, 
           data: [ 
            [1072915200000, 29.73], 
            [1073001600000, 29.73], 
            [1073088000000, 29.73], 
            [1073174400000, 29.73] 
           ], 
           tooltip: { 
            valueDecimals: 2 
           } 
          }, { 
           name: 'Gas', 
           yAxis:2, 
           data: [ 
            [1072915200000, 0.823], 
            [1073001600000, 0.82], 
            [1073088000000, 0.82], 
            [1073174400000, 0.82] 
           ], 
           tooltip: { 
            valueDecimals: 2 
           } 
          } 
         ] 
        }); 
       }); 
      }); 
     }); 

     // create the chart when all data is loaded 
     function createChart() { 
      chart = new Highcharts.StockChart({ 
       chart: { 
        renderTo: 'container' 
       }, 
       rangeSelector: { 
        selected: 4 
       }, 
       yAxis: [{ // Primary yAxis 
        labels: { 
         formatter: function() { 
          return (this.value > 0 ? '+' : '') + this.value + '%'; 
         }, 
         style: { 
          color: '#89A54E' 
         } 
        }, 
        title: { 
         text: 'Electric', 
         style: { 
          color: '#89A54E' 
         } 
        }, 
        opposite: true 
       }, { // Secondary yAxis 
        gridLineWidth: 0, 
        title: { 
         text: 'Oil', 
         style: { 
          color: '#4572A7' 
         } 
        }, 
        labels: { 
         formatter: function() { 
          return this.value; 
         }, 
         style: { 
          color: '#4572A7' 
         } 
        } 

       }, { // Tertiary yAxis 
        gridLineWidth: 0, 
        title: { 
         text: 'Gas', 
         style: { 
          color: '#AA4643' 
         } 
        }, 
        labels: { 
         formatter: function() { 
          return this.value; 
         }, 
         style: { 
          color: '#AA4643' 
         } 
        }, 
        opposite: true 
       }], 
       plotOptions: { 
        series: { 
         compare: 'percent' 
        } 
       }, 
       tooltip: { 
        pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.change}%)<br/>', 
        valueDecimals: 2 
       }, 
       series: seriesOptions 
      }); 
     } 
    }); 
})(jQuery);

谁能帮我告诉图例和轴标题？

传说还需要点击才能让每一行消失并在点击时重新出现。

非常感谢您的帮助

皮特

来源

2013-03-20 Pete Naylor