HighStock Несколько серий из CSV-файла (Arduino Based & JavaScript)

ОК привет всем. Я разработал мои работы HighStock от CSV-файла . Я могу получить время и 1 строку для моей серии. Я хочу, чтобы получил 2 строки от данных. Есть идеи? В будущем я хочу получить 2 десятичных знака, например 25,01. у вас есть идеи для этого?HighStock Несколько серий из CSV-файла (Arduino Based & JavaScript)

В CSV есть секунды, данные, данные. И он печатает его в течение 1 минуты.
И да, я из Финляндии Студент и мой код отстой ... :)

http://imgur.com/L2VSRGj

данных: Время в секундах, Value, Value

0,25,23
60,25,23
120,25,23
....
14220,24,22
14280,24,22
14340,24,22

Javascript в моем HC.htm: (это индекс)

<!DOCTYPE HTML> 
<html>   
    <head>  
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
     <title>Hannun virtamittaus</title> 

     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
     <style type="text/css"> 
                                  ${demo.css} 
     </style> 
     <script type="text/javascript"> 
function getDataFilename(str){ 
    point = str.lastIndexOf("file=")+4; 

    tempString = str.substring(point+1,str.length) 
    if (tempString.indexOf("&") == -1){ 
    return(tempString); 
    } 
    else{ 
     return tempString.substring(0,tempString.indexOf("&")); 
    } 

} 

query = window.location.search; 

var dataFilePath = "/data/"+getDataFilename(query); 

$(function() { 
    var chart; 
    $(document).ready(function() { 

     // define the options 
     var options = { 

      chart: { 
       renderTo: 'container', 
       zoomType: 'x', 
       spacingRight: 5 
      }, 

      title: { 
       text: 'Arduinolla mitatut virran arvot' 
      }, 

      subtitle: { 
       text: 'Zoomaa haluttu luenta alue' 
      }, 

      xAxis: { 
       type: 'datetime', 
       maxZoom: 2 * 4000000 
      }, 

      yAxis: { 
       title: { 
        text: 'Virran arvot 0-250A' 
       }, 
       min: 0, 
       startOnTick: false, 
       showFirstLabel: false 
      }, 

      legend: { 
       enabled: false 
      }, 

      tooltip: { 
       formatter: function() { 
         return '<b>'+ this.series.name +'</b><br/>'+ 
         Highcharts.dateFormat('%H:%M - %b %e, %Y', this.x) +': '+ this.y; 
       } 
      }, 

      plotOptions: { 
       series: { 
        cursor: 'pointer', 
        lineWidth: 1.0, 
        point: { 
         events: { 
          click: function() { 
           hs.htmlExpand(null, { 
            pageOrigin: { 
             x: this.pageX, 
             y: this.pageY 
            }, 
            headingText: this.series.name, 
            maincontentText: Highcharts.dateFormat('%H:%M - %b %e, %Y', this.x) +':<br/> '+ 
             this.y, 
            width: 100 
           }); 
          } 
         } 
        }, 
       } 
      }, 

      series: [{ 
       name: 'Op1', 
       marker: { 
        radius: 2 
       } 
      }] 
     }; 


     // Load data asynchronously using jQuery. On success, add the data 
     // to the options and initiate the chart. 
     // http://api.jquery.com/jQuery.get/ 

     jQuery.get(dataFilePath, null, function(csv, state, xhr) { 
      var lines = [], 
       date, 

       // set up the two data series 
       lightLevels = []; 

      // inconsistency 
      if (typeof csv !== 'string') { 
       csv = xhr.responseText; 
      } 

      // split the data return into lines and parse them 
      csv = csv.split(/\n/g); 
      jQuery.each(csv, function(i, line) { 

       // all data lines start with a double quote 
       line = line.split(','); 
       date = parseInt(line[0], 10)*1400; 

       lightLevels.push([ 
        date, 
        parseInt(line[1], 10) 
       ]); 

      }); 

      options.series[0].data = lightLevels; 

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

}); 
     </script> 
    </head> 
    <body> 
<script src="https://code.highcharts.com/stock/4.2.4/highstock.js"></script> 
<script src="https://code.highcharts.com/stock/4.2.4/modules/exporting.js"></script> 

<div id="container" style="height: 400px; min-width: 155px"></div> 
    </body> 
</html>

источник

2016-05-25 Hannu Rajala

Вам нужно установить массив объектов серии.

Серия:

series: [{ 
      name: 'Op1', 
      marker: { 
       radius: 2 
      } 
},{ 
      name: 'Op2' 
}]

Parser

jQuery.get(dataFilePath, null, function(csv, state, xhr) { 
      var lines = [], 
       date, 

       // set up the two data series 
       lightLevels = []; 
       topLevels = []; 

      // inconsistency 
      if (typeof csv !== 'string') { 
       csv = xhr.responseText; 
      } 

      // split the data return into lines and parse them 
      csv = csv.split(/\n/g); 
      jQuery.each(csv, function(i, line) { 

       // all data lines start with a double quote 
       line = line.split(','); 
       date = parseInt(line[0], 10)*1400; 

       lightLevels.push([ 
        date, 
        parseInt(line[1], 10) 
       ]); 

       topLevels.push([ 
        date, 
        parseInt(line[2], 10) 
       ]); 

      }); 

      options.series[0].data = lightLevels; 
      options.series[1].data = topLevels; 

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

источник

2016-05-27 11:38:36

Спасибо. Но теперь он печатает только Op2: /. Может быть, это потому, что они почти одинаковые ценности? –

Я думаю, что это возможно, в легенде вы должны увидеть два предмета, не так ли? –

Yeap. Я попытаюсь сделать более разные вычисления. –

HighStock Несколько серий из CSV-файла (Arduino Based & JavaScript)

ответ

Смежные вопросы