如何從CSV文件解析數據到數組，以便它可以用於預格式化的Highchart

Question

我想解析CSV文件中的數據，並且我通過了http://www.highcharts.com/docs中的說明。但是，提供的代碼直接使用解析的數據創建新圖表，我無法理解如何將其應用於當前圖表。我試圖從CSV文件中獲取字符串，並將它們用作JavaScript中的數組來替換下面代碼中的數值數組。

這是需要將要使用的曲線圖：需要被從文件中取出 http://jsfiddle.net/strawberry/Cyxv6/

數據如下：

類：[ '2010'， '2011'， '2012'， '2013'， '2014']

名稱： '鱷梨' ... 數據：[1600,1540,1350,1450,1600]，

名字： '蘋果'， ... 數據：39000，40000，40500，41000，42000]，

名稱： '桔子'， ... 數據：8000，5000，4000， 4500，3000]，

名稱： '香蕉'， ... 數據：4000，6000，4500，5000，4600]，

從CSV文件中的數據：

一年鱷梨蘋果橘子香蕉 2010年度1600 39000 8000 4000 2011年度1540 40000 5000 6000 y2012 1350 40500 4000 4500 y2013 1450 41000 4500 5000 Y2014 1600 42000 3000 4600

代碼：

$(function() { 

    $('#container').highcharts({ 
     chart: { 
      zoomType: 'xy' 
     }, 
     title: { 
      text: 'apples and oranges and bananas and avocado' 
     }, 
     // subtitle: { 
     //  text: 'Source: WorldClimate.com' 
     // }, 


     xAxis: [{ 
      categories: ['2010', '2011', '2012', '2013', '2014'] 
     }], 
     yAxis: [{ // Primary yAxis 
      labels: { 
       format: '{value}', 
       style: { 
        color: '#89A54E' 
       } 
      }, 
      title: { 
       text: 'other', 
       style: { 
        color: '#89A54E' 
       } 
      } 
     }, { // Secondary yAxis 
      title: { 
       text: 'fruits', 
       style: { 
        color: '#4572A7' 
       } 
      }, 
      labels: { 
       format: '{value}', 
       style: { 
        color: '#4572A7' 
       } 
      }, 
      opposite: true 
     }], 

     tooltip: { 
      shared: true 
     }, 

     legend: { 
      align: 'center', 
      layout: 'horizontal', 
      x: 0, 


      title: { 
       text: '<span style="font-size: 11px; color: #666; font-weight: normal" >To single out the different datasets, please click on the respective names below:</span>', 
       style: { 
        fontStyle: 'italic' 
       } 

      } 
     }, 






     series: [{ 
       name: 'avocado', 
       color: '#d6bfe3', 
       type: 'column', 
       yAxis: 1, 
       data: [1600,1540,1350,1450,1600], 
       tooltip: { 
        valueSuffix: ' ' 
       } 

     }, { 
      name: 'apples', 
      marker: { 
       enabled: false 
      }, 
      color: '#4da90c', 
      lineWidth: 3, 
      type: 'spline', 

      dataLabels: { 
       enabled: 'True' 
      }, 
      data: [39000, 40000, 40500, 41000, 42000], 

      tooltip: { 
       valueSuffix: '' 
      } 
     }, 

     { 
      name: 'oranges', 
      marker: { 
       enabled: false 
      }, 
      color: '#f8a632', 
      lineWidth: 3, 
      type: 'spline', 
      data: [8000, 5000, 4000, 4500, 3000], 

      tooltip: { 
       valueSuffix: '' 
      } 
     }, 


     { 
      name: 'bananas', 
      marker: { 
       enabled: false 
      }, 
      color: '#939b9d', 
      style: "Dash", 
      lineWidth: 3, 
      type: 'spline', 
      dashStyle: 'longdash', 
      data: [4000, 6000, 4500, 5000, 4600], 
      tooltip: { 
       valueSuffix: '' 
      } 
     } 



     ] 
    }); 
}) 

Answer 1

在開始的時候您需要熟悉我們的解析如何與我們的數據協同工作。然後使解析器適應您的數據，達到結構（如硬編碼）。您還需要通過跳過第一個字母來將'y2003'轉換爲年份。 （即通過indexOf或匹配字符串）。