Highstock圖表給出「Uncaught TypeError：無法讀取屬性'addPoint'的未定義」錯誤

Question

我正在使用highstock圖表庫爲一組4個圖表。我使用了HERE所述的選項對象和文字符號。這4個圖表默認具有相同的選項集（下面的代碼中的renderCharts（）函數負責這個），並且有一個圖表類型選擇器（setChatType（）函數），用戶可以通過它幫助更改圖表類型。

查看所有上一頁HERE。

任何人都可以請告訴我在控制檯中的這個錯誤的原因和解決方案： 「Uncaught TypeError：無法讀取未定義的屬性'addPoint'？

謝謝！

  /* ============ CHARTS OPTIONS BEGIN ============ */ 

       var options = { 
       chart : { 
       zoomType: 'x', 
       events : { 
        load : function() { 
         // set up the updating of the chart each second 
         var series = this.series[0]; 
         setInterval(function() { 
         var x = (new Date()).getTime(); 
         var y = Math.round(Math.random() * 100); 
         series.addPoint([x, y]); 
         }, 1000); 
        } 
        } 
       }, 
       rangeSelector: { 
        buttons: [{ 
         count: 1, 
         type: 'minute', 
         text: '1M' 
        }, { 
         count: 5, 
         type: 'minute', 
         text: '5M' 
        }, { 
         type: 'all', 
         text: 'All' 
        }], 
        inputEnabled: false, 
        selected: 0 
       }, 
       title : { 
        text: null 
       }, 
       exporting: { 
        enabled: false 
       }, 
       // Disable navigator 
       navigator : { 
        enabled : false 
       }, 
       series : [{ 
        name : '', 
        data : (function() { 
         // generate an array of random data 
         var data = [], 
         time = (new Date()).getTime(), i; 

         for (i = -999; i <= 0; i = i + 1) { 
          data.push([ 
           time + i * 1000, 
           Math.round(Math.random() * 100) 
          ]); 
         } 
         return data; 
        }()) 
       }] 
      } 

      /* ============ CHARTS OPTIONS END ============ */ 

      /* ============ DRAW CHARTS BEGIN ============ */ 

      function renderCharts(){ 
       $('div.chart-container').each(function(){ 
       var chartId = $(this).attr('id'); 
       var chartIdParts = chartId.split('-'); 
       var chartIdentifier = chartIdParts[1]; 

       //Set chart options dinamically 
       var chartId = "chart" + chartIdentifier; 
       var chart = $('#' + chartId); 
       var renderTo = "chartcontainer-" + chartIdentifier; 

       //Render Charts for each aech container 
       options.chart.renderTo = renderTo; 
       options.chart.type = 'line'; 
       var chart = new Highcharts.StockChart(options); 
       }); 
      } 

      function setChatType(){ 
       // Show types list (piker) 
       $('.current-type').on('click', function(){ 
       $(this).parents('div.chart-options').find('ul.type ul').addClass('clicked'); 
       }); 

       $('.chart-options ul ul li a').on('click', function(){ 

       //Get piked chart type 
       var type = $(this).parent('li').attr('data-chart-type'); 

       // For text and Title Capitalization 
       var textAndTitle = type.replace(/^[a-z]/, function(m){ return m.toUpperCase() }); 

       // Show piked type in picker 
       var currSetClass = 'current-type ' + type; 
       $(this).parents('.chart-options').find('.current-type') 
        .text(textAndTitle) 
        .attr({ 
         class : currSetClass, 
         title: textAndTitle 
        }); 

       // Then Hide the types list 
       $('.chart-options ul ul').removeClass('clicked'); 

       //Identify current chart container by ID 
       var chartCtnId= $(this).parents('div.chart').find('.chart-container').attr('id'); 

       // Render chart again with new type 
       options.chart.renderTo = chartCtnId; 
       options.chart.type = type; 
       var chart = new Highcharts.StockChart(options); 

       }); 
      } 

      /* ============ DRAW CHARTS END ============ */ 

      $(document).ready(function(){ 

       $("article.grid:even").addClass('left') 
       $("article.grid:odd").addClass('right'); 

      // Draw charts 
       renderCharts(); 

       // Set/change chart type 
       setChatType(); 

      }); 

Answer 1

的解決方案，由帕維爾·建議： 代替 var chart = new Highcharts.StockChart(options); 使用 var chart = new Highcharts.StockChart($.extend(true, {}, options));