Wykresy i Ładowanie danych z pliku txt lub csv

0

Witam

Mam taki problem. Mam termometr który zapisuje mi dane z 5 czujników do pliku txt lub csv.
Potrzebuje zrobić wykres temperatury na stronie. Z php niewiele miałem do czynienia jak juz to cos z gotowców.
Myślałem nad wykorzystaniem google charts ale mam problem jak wczytać dane z pliku.

Dane w pliku wyglądają tak.
txt

2014-07-11 22:41:55	18.50  27.50  23.50  37.50  46.50
2014-07-11 22:42:06	18.50  27.00  23.50  37.50  46.50
2014-07-11 22:42:16	18.50  27.00  23.50  37.50  46.50
2014-07-11 22:42:26	18.50  27.00  23.50  37.50  46.50
2014-07-11 22:42:37	18.50  26.50  23.50  37.50  46.50
2014-07-11 22:42:47	18.50  26.50  23.50  37.50  46.50
2014-07-11 22:42:58	18.50  26.50  23.50  37.50  46.50

a w csv

2014-07-12 12:37:09	;31.00;27.00;23.50;38.00;47.00
2014-07-12 12:37:15	;31.00;27.00;23.50;38.00;47.00
2014-07-12 12:37:20	;31.00;27.00;23.50;38.00;47.00
2014-07-12 12:37:25	;31.00;27.00;23.00;38.00;47.00
2014-07-12 12:37:31	;31.00;27.00;23.50;38.00;47.00
2014-07-12 12:37:36	;31.00;27.00;23.00;38.00;47.00
2014-07-12 12:37:42	;31.00;27.00;23.50;38.00;47.00
2014-07-12 12:37:47	;30.50;27.00;23.50;38.00;47.00

Stronka wyglda tak:


<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Data',   		          'temp1', 'temp2',  'temp3'],
          ['2014-07-12 12:37:09',  31.00,    23.50,   47.00],
          ['2014-07-12 12:37:15',  31.00,    23.50,   47.00],
          ['2014-07-12 12:37:20',  31.00,    23.50,   47.00],
          ['2014-07-12 12:37:25',  31.00,    23.50,   47.00],
	  ['2014-07-12 12:37:31',  31.00,    23.50,   47.00],
        ]);

        var options = {
          title: 'Company Performance'
        };

        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

Tylko jak wczytać te dane z pliku.
Albo jak zrobić to w inny sposób.

Pozdrawiam

0

Proste funkcje fopen(), fgets() itp.
fgets() czytasz z pliku linie, wrzucając to do petli while czytasz wszystkie linie po kolei, jest od cholery poradników co do tego..
Funkcją split() możesz rozdzielić jakiś ciąg znaków do tablicy po tym czym chcesz, czyli jeśli jako argument split() podasz ":" to ze stringu

$string = "asd:123";

powstanie

 
$costam[0] = "asd";
$costam[1] = "123";
0

Witam ponownie.
Troszkę zmieniła się koncepcja urządzenia (poprzednio podłączone było poprzez usb i zapisywało dane w pliku).
Teraz podpięte mam przez LAN. Zrobiłem już odczyt z czujników poprzez php, aktualne dane są wyświetlane na stronie, poza tym co 5 minut wszystko jest zapisywane do bazy danych mysql.
Baza danych na kolumny: "data" (format np: 2014-07-20 1800), "temp1" , "temp2", itd.
Serwer php (webserv) działa na localhost.

I dalej mam problem z rysowaniem wykresów. Chciałem zrobic to poprzez JavaScript Charts.
Potrafię pobrać dane z bazy
Wzorowałem się na tym artykule.

http://www.amcharts.com/tutorials/using-php-to-hook-up-charts-to-mysql-data-base/

Oto kod pliku data.php

 
<?php
// Connect to MySQL
$link = mysql_connect( 'localhost', 'root', '' );
if ( !$link ) {
  die( 'Could not connect: ' . mysql_error() );
}

// Select the data base
$db = mysql_select_db( 'temperatura', $link );
if ( !$db ) {
  die ( 'Error selecting database \'temperatura\' : ' . mysql_error() );
}

// Fetch the data
$query = "
  SELECT *
  FROM tempe
  ORDER BY data ASC";
$result = mysql_query( $query );

// All good?
if ( !$result ) {
  // Nope
  $message  = 'Invalid query: ' . mysql_error() . "\n";
  $message .= 'Whole query: ' . $query;
  die( $message );
}

// Print out rows
$prefix = '';
echo "[\n";
while ( $row = mysql_fetch_assoc( $result ) ) {
  echo $prefix . " {\n";
  echo '  "data": "' . $row['data'] . '",' . "\n";
  echo '  "temp1": ' . $row['temp1'] . ',' . "\n";
  echo '  "temp2": ' . $row['temp2'] . '' . "\n";
  echo " }";
  $prefix = ",\n";
}
echo "\n]";

// Close the connection
mysql_close($link);
?>

Plik do rysowania wykresu index.php

 
<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>amCharts tutorial: Loading external data</title>
</head>
<body>

  <!-- prerequisites -->
  <link rel="stylesheet" href="http://www.amcharts.com/lib/style.css" type="text/css">
  <script src="amcharts/amcharts.js" type="text/javascript"></script>
  <script src="amcharts/serial.js" type="text/javascript"></script>

  <!-- cutom functions -->
  <script>
AmCharts.loadJSON = function(url) {
  // create the request
  if (window.XMLHttpRequest) {
    // IE7+, Firefox, Chrome, Opera, Safari
    var request = new XMLHttpRequest();
  } else {
    // code for IE6, IE5
    var request = new ActiveXObject('Microsoft.XMLHTTP');
  }

  // load it
  // the last "false" parameter ensures that our code will wait before the
  // data is loaded
  request.open('GET', url, false);
  request.send();

  // parse adn return the output
  return eval(request.responseText);
};
  </script>

  <!-- chart container -->
  <div id="chartdiv" style="width: 600px; height: 300px;"></div>

  <!-- the chart code -->
  <script>
var chart;

// create chart
AmCharts.ready(function() {

  // load the data
  var chartData = AmCharts.loadJSON('data.php');

  // SERIAL CHART
  chart = new AmCharts.AmSerialChart();
  chart.pathToImages = "http://www.amcharts.com/lib/images/";
  chart.dataProvider = chartData;
  chart.categoryField = "data";
  chart.dataDateFormat = "YYYY-MM-DD";

  // GRAPHS

  var graph1 = new AmCharts.AmGraph();
  graph1.valueField = "temp1";
  graph1.bullet = "round";
  graph1.bulletBorderColor = "#FFFFFF";
  graph1.bulletBorderThickness = 2;
  graph1.lineThickness = 2;
  graph1.lineAlpha = 0.5;
  chart.addGraph(graph1);

  var graph2 = new AmCharts.AmGraph();
  graph2.valueField = "temp2";
  graph2.bullet = "round";
  graph2.bulletBorderColor = "#FFFFFF";
  graph2.bulletBorderThickness = 2;
  graph2.lineThickness = 2;
  graph2.lineAlpha = 0.5;
  chart.addGraph(graph2);

  // CATEGORY AXIS
  chart.categoryAxis.parseDates = true;

  // WRITE
  chart.write("chartdiv");
});

  </script>

</body>
</html>

I tu mały zonk bo dostaję taki wynik.

user image

Wiem że problem jest z pobraniem odpowiednio daty tylko za nic nie mogę dojść co i jak.
Chciałbym móc generować wykresy dzienne tygodniowe i miesięczne.

Pozdrawiam i dziękuję za odpowiedź

0

Hej czy udało Ci się rozwiązać problem z wykresem mam identycznie i niestety nie wiem jak sobie poradzić

0

@maciusiek610 wołam, bo anonim odkopuje posty licząc, że po roku dalej codziennie wciskasz f5

0

Na tamten czas nikt nie pomógł.
Może coś się zmieniło teraz.

0

DateFormat bejbe. Zmien i bedzie git. na razie twoj skrypt wrzuca wszystko w 1dzien bo masz yyyy mm dd brakuje hh mm ss

1 użytkowników online, w tym zalogowanych: 0, gości: 1