2016-04-11 7 views
0

Я разрабатываю веб-приложение, и я использую плагин JS Highcharts, чтобы помочь мне рисовать некоторые диаграммы. Иногда я загружаю CSV-файл с более чем 100 000 строк с 4 столбцами.Highcharts downsampling - CSV

Очевидно, что плагин графика встречает некоторые проблемы. Таким образом, я не могу сжать файл CSV напрямую, но я нашел плагин Downsampling Highcharts (http://www.highcharts.com/plugin-registry/single/13/Highcharts-Downsample), который выполняет эту работу!

Но на самом деле, этот плагин может только инициализировать Серию с пороговым значением .. И я не знаю, как применить этот метод на моей серии нагруженной CSV ..

загружает мой CSV так вместо «серии» атрибут задается плагин использование:

data: {csv: csv}, 

плагин док говорит нам использовать его так:

series: [{ 
    downsample: { 
    threshold: 1000 // 0 disables downsampling for this series. 
    }, 
    data: // Your data (array of arrays with two values or array of numerical values) 
}] 

Но я не использую «серии» атрибут becaus е я загружаю свою серию непосредственно из файла CSV ..

Итак, я хочу, чтобы найти решение декодирует мой файл CSV, используя это плагин даунсамплинг Hicharts ..

Спасибо так много!

ответ

0

Итак, наконец, я нашел решение! Я сам разбираю свой файл CSV, и я могу указать атрибут downsample:

var options = {      //Initialize my chart's option 
       chart: { 
        zoomType: 'x', 
        renderTo: $('#chart-'+unused)[0] 
       }, 
       title: { 
        text: elem.title 
       }, 
       credits: { 
        enabled: false 
       }, 
       xAxis: { 
        categories: [], //initialize empty category array 
        type: "line" 
       }, 
       yAxis: { 
        title: { 
         text: "milli-SI" 
        } 
       }, 
       series: [] //initialize empty serie array 
      }; 

var lines = csv.split('\n'); 
$.each(lines, function(lineNo, line) { 
    var items = line.split(','); 
    if (lineNo == 0) { 
     $.each(items, function(itemNo, item) { 
      if (itemNo > 0) { 
       var series = { 
        data: [], 
        name: item, 
        downsample : {threshold: 2000} //initialize downsample for a specific serie 
       }; 
       options.series.push(series); 
      } 
     }); 
    } 

    else { 
     $.each(items, function(itemNo, item) { 
      if (item.length == 0) 
       return; 
      if (itemNo == 0) { 
       options.xAxis.categories.push(item); 
      } else { 
       options.series[itemNo -1].data.push(parseFloat(item)); 
      } 
     }); 
    } 

}); 
var chart = new Highcharts.Chart(options);