Συντονιστής: konnn
από simosx » 11 Σεπ 2012, 17:20
the_eye έγραψε:
Ψάχνω πως να κάνω διάγραμμα σε php ή html + javascript, όπου στον άξονα y να υπάρχουν αριθμητικές τιμές και στον άξονα x ο χρόνος σε μορφή 2012-09-02 00:45:16.
από the_eye » 11 Σεπ 2012, 17:29
από simosx » 11 Σεπ 2012, 18:06
the_eye έγραψε:Αυτό ψάχνω, κάποιο API όπου να "βλέπει" σωστά το 2012-09-02 00:45:16
από the_eye » 11 Σεπ 2012, 18:12
από simosx » 11 Σεπ 2012, 19:24
the_eye έγραψε:@simosx
Σίμο δεν κατάλαβα τι γράφεις ! Τα δεδομένα είναι ήδη σε μορφή αναγνώσιμη. Δες το αρχικό θέμα.
από the_eye » 11 Σεπ 2012, 20:01
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta http-equiv="refresh" content="200">
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
google.setOnLoadCallback(drawChart2);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Time', '%'],
[1347227413,1.84],[1347227713,0.96],[1347228012,0.59],[1347228312,0.45],[1347228612,0.23],[1347228912,0.20],[1347229212,0.33],[1347229512,0.59],[1347229812,0.41],[1347230112,0.32],[1347230413,0.45],[1347230712,0.50],[1347231013,0.47],[1347231313,0.25],[1347231612,0.27],[1347231913,0.33],[1347232212,0.41],[1347232513,0.76],[1347232813,1.10],[1347233113,1.40],[1347233413,1.13],[1347233713,0.92],[1347234012,0.98],[1347234312,0.74],[1347234613,0.71],[1347234912,0.63],[1347235213,0.89],[1347235513,0.78],[1347235812,0.81],[1347236113,1.17],[1347236413,0.90],[1347236714,1.21],[1347237012,1.55],[1347237313,1.66],[1347237613,2.08],[1347237912,2.45],[1347238212,2.46],[1347238513,1.49],[1347238813,1.43],[1347239113,1.06],[1347239412,0.68],[1347239713,0.57],[1347240013,0.69],[1347240312,0.83],[1347240613,0.92],[1347240912,0.91],[1347241213,0.55],[1347241513,0.38],[1347241815,0.60],[1347242113,0.70],[1347242413,0.82],[1347242712,0.75],[1347243013,0.76],[1347243313,0.62],[1347243613,0.85],[1347243913,0.75],[1347244214,0.76],[1347244513,0.96],[1347244813,1.08],[1347245113,0.69],[1347245413,0.75],[1347245713,0.55],[1347246014,0.87],[1347246314,0.85],[1347271214,1.74],[1347271513,1.02],[1347271814,0.91],[1347272113,0.79],[1347272413,0.50],[1347272714,0.39],[1347273014,0.52],[1347273314,0.54],[1347273614,0.63],[1347273914,0.41],[1347274213,0.78],[1347274514,0.87],[1347274814,0.75],[1347275114,0.76],[1347275414,0.46],[1347275713,0.33],[1347276014,0.32],[1347276314,0.42],[1347276614,0.75],[1347276914,0.78],[1347277214,0.69],[1347277514,0.54],[1347277814,0.76],[1347278114,0.54],[1347278414,0.55],[1347278714,0.50],[1347279013,0.62],[1347279314,0.42],[1347279614,0.64],[1347308117,1.03],[1347308415,1.21],[1347308715,0.92],[1347309015,0.57],[1347309315,0.71],[1347309615,0.64],[1347309915,0.60],[1347310215,0.53],[1347310515,0.64],[1347310815,0.82],[1347311116,0.63],[1347311419,0.47],[1347311719,0.53],[1347312021,0.72],[1347312320,0.77],[1347312617,0.90],[1347312922,0.83],[1347313216,0.63],[1347313519,1.09],[1347313818,1.22],[1347314117,0.59],[1347314418,0.83],[1347314721,0.67],[1347315017,0.85],[1347315316,0.98],[1347315617,0.80],[1347315918,0.79],[1347316220,0.97],[1347316517,1.18],[1347316818,0.60],[1347317116,0.54],[1347317421,0.42],[1347317719,0.72],[1347318020,0.77],[1347318316,0.72],[1347318619,1.24],[1347318917,3.27],[1347319216,2.60],[1347319521,2.52],[1347319819,3.20],[1347320120,3.32],[1347320418,2.68],[1347320720,1.38],[1347321021,1.10],[1347321322,0.70],[1347321621,0.70],[1347321917,2.05],[1347322217,2.57],[1347322522,2.69],[1347322821,2.47],[1347323122,1.95],[1347323422,1.39],[1347323716,0.82],[1347371119,1.88],[1347371423,1.74],[1347371721,0.97],[1347372018,1.03],[1347372323,0.63],[1347372623,0.52],[1347372920,0.76],[1347373224,0.53],[1347373518,0.79],[1347373822,0.72],[1347374118,0.60],[1347374421,0.44],[1347374718,0.63],[1347375023,0.74],[1347375321,0.84],[1347375621,0.63],[1347375921,0.63],[1347376220,0.65],[1347376518,0.98],[1347376821,0.53],[1347377122,0.39],[1347377419,1.14],[1347377719,1.84],[1347378024,2.06],[1347378320,2.26],[1347378619,1.30],[1347378919,0.88],[1347379221,0.86],[1347379521,0.75],[1347379820,0.62],[1347380123,0.55],[1347380421,0.50],[1347380723,0.37],[1347381019,0.54],[1347381321,0.48],[1347381621,0.51],[1347381922,0.78] ]);
var options = {
title: 'Cpu Load Graph',
curveType: "function",
hAxis: {title: 'Time', titleTextStyle: {color: 'red'}, slantedTextAngle: 90, showTextEvery: 150}
};
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
function drawChart2() {
var data = google.visualization.arrayToDataTable([
['Time', 'MB'],
['2012-09-10 00:50:13',956],['2012-09-10 00:55:13',959],['2012-09-10 01:00:12',973],['2012-09-10 01:05:12',958],['2012-09-10 01:10:12',959],['2012-09-10 01:15:12',959],['2012-09-10 01:20:12',960],['2012-09-10 01:25:12',908],['2012-09-10 01:30:12',908],['2012-09-10 01:35:12',925],['2012-09-10 01:40:13',927],['2012-09-10 01:45:12',927],['2012-09-10 01:50:13',926],['2012-09-10 01:55:13',926],['2012-09-10 02:00:12',899],['2012-09-10 02:05:13',924],['2012-09-10 02:10:12',923],['2012-09-10 02:15:13',901],['2012-09-10 02:20:13',892],['2012-09-10 02:25:13',882],['2012-09-10 02:30:13',841],['2012-09-10 02:35:13',835],['2012-09-10 02:40:12',813],['2012-09-10 02:45:12',776],['2012-09-10 02:50:13',804],['2012-09-10 02:55:12',795],['2012-09-10 03:00:13',754],['2012-09-10 03:05:13',792],['2012-09-10 03:10:12',781],['2012-09-10 03:15:13',741],['2012-09-10 03:20:13',766],['2012-09-10 03:25:14',701],['2012-09-10 03:30:12',695],['2012-09-10 03:35:13',693],['2012-09-10 03:40:13',695],['2012-09-10 03:45:12',697],['2012-09-10 03:50:12',705],['2012-09-10 03:55:13',690],['2012-09-10 04:00:13',699],['2012-09-10 04:05:13',716],['2012-09-10 04:10:12',721],['2012-09-10 04:15:13',710],['2012-09-10 04:20:13',722],['2012-09-10 04:25:12',731],['2012-09-10 04:30:13',703],['2012-09-10 04:35:12',709],['2012-09-10 04:40:13',746],['2012-09-10 04:45:13',741],['2012-09-10 04:50:15',739],['2012-09-10 04:55:13',710],['2012-09-10 05:00:13',780],['2012-09-10 05:05:12',784],['2012-09-10 05:10:13',778],['2012-09-10 05:15:13',775],['2012-09-10 05:20:13',755],['2012-09-10 05:25:13',760],['2012-09-10 05:30:14',761],['2012-09-10 05:35:13',782],['2012-09-10 05:40:13',733],['2012-09-10 05:45:13',747],['2012-09-10 05:50:13',734],['2012-09-10 05:55:13',721],['2012-09-10 06:00:14',716],['2012-09-10 06:05:14',730],['2012-09-10 13:00:14',936],['2012-09-10 13:05:13',917],['2012-09-10 13:10:14',908],['2012-09-10 13:15:13',907],['2012-09-10 13:20:13',915],['2012-09-10 13:25:14',910],['2012-09-10 13:30:14',836],['2012-09-10 13:35:14',855],['2012-09-10 13:40:14',831],['2012-09-10 13:45:14',841],['2012-09-10 13:50:13',816],['2012-09-10 13:55:14',824],['2012-09-10 14:00:14',799],['2012-09-10 14:05:14',831],['2012-09-10 14:10:14',841],['2012-09-10 14:15:13',854],['2012-09-10 14:20:14',856],['2012-09-10 14:25:14',814],['2012-09-10 14:30:14',794],['2012-09-10 14:35:14',846],['2012-09-10 14:40:14',876],['2012-09-10 14:45:14',875],['2012-09-10 14:50:14',791],['2012-09-10 14:55:14',800],['2012-09-10 15:00:14',781],['2012-09-10 15:05:14',782],['2012-09-10 15:10:13',783],['2012-09-10 15:15:14',813],['2012-09-10 15:20:14',795],['2012-09-10 23:15:17',1186],['2012-09-10 23:20:15',1057],['2012-09-10 23:25:15',1034],['2012-09-10 23:30:15',1032],['2012-09-10 23:35:15',979],['2012-09-10 23:40:15',969],['2012-09-10 23:45:15',951],['2012-09-10 23:50:15',965],['2012-09-10 23:55:15',963],['2012-09-11 00:00:15',949],['2012-09-11 00:05:16',945],['2012-09-11 00:10:19',944],['2012-09-11 00:15:19',895],['2012-09-11 00:20:21',827],['2012-09-11 00:25:20',867],['2012-09-11 00:30:17',851],['2012-09-11 00:35:22',851],['2012-09-11 00:40:16',848],['2012-09-11 00:45:19',750],['2012-09-11 00:50:18',792],['2012-09-11 00:55:17',826],['2012-09-11 01:00:18',802],['2012-09-11 01:05:21',775],['2012-09-11 01:10:17',802],['2012-09-11 01:15:16',726],['2012-09-11 01:20:17',692],['2012-09-11 01:25:18',706],['2012-09-11 01:30:20',738],['2012-09-11 01:35:17',739],['2012-09-11 01:40:18',747],['2012-09-11 01:45:16',737],['2012-09-11 01:50:21',747],['2012-09-11 01:55:19',787],['2012-09-11 02:00:20',774],['2012-09-11 02:05:16',842],['2012-09-11 02:10:19',907],['2012-09-11 02:15:17',892],['2012-09-11 02:20:16',894],['2012-09-11 02:25:21',907],['2012-09-11 02:30:19',904],['2012-09-11 02:35:20',906],['2012-09-11 02:40:18',1005],['2012-09-11 02:45:20',909],['2012-09-11 02:50:21',840],['2012-09-11 02:55:22',875],['2012-09-11 03:00:21',851],['2012-09-11 03:05:17',749],['2012-09-11 03:10:17',829],['2012-09-11 03:15:22',747],['2012-09-11 03:20:21',721],['2012-09-11 03:25:22',855],['2012-09-11 03:30:22',848],['2012-09-11 03:35:16',813],['2012-09-11 16:45:19',1189],['2012-09-11 16:50:23',872],['2012-09-11 16:55:21',869],['2012-09-11 17:00:18',916],['2012-09-11 17:05:23',921],['2012-09-11 17:10:23',935],['2012-09-11 17:15:20',856],['2012-09-11 17:20:24',860],['2012-09-11 17:25:18',812],['2012-09-11 17:30:22',836],['2012-09-11 17:35:18',841],['2012-09-11 17:40:21',837],['2012-09-11 17:45:18',825],['2012-09-11 17:50:23',672],['2012-09-11 17:55:21',705],['2012-09-11 18:00:21',735],['2012-09-11 18:05:21',788],['2012-09-11 18:10:20',737],['2012-09-11 18:15:18',728],['2012-09-11 18:20:21',735],['2012-09-11 18:25:22',712],['2012-09-11 18:30:19',692],['2012-09-11 18:35:19',699],['2012-09-11 18:40:24',699],['2012-09-11 18:45:20',719],['2012-09-11 18:50:19',683],['2012-09-11 18:55:19',681],['2012-09-11 19:00:21',702],['2012-09-11 19:05:21',787],['2012-09-11 19:10:20',789],['2012-09-11 19:15:23',788],['2012-09-11 19:20:21',790],['2012-09-11 19:25:23',790],['2012-09-11 19:30:19',778],['2012-09-11 19:35:21',789],['2012-09-11 19:40:21',772],['2012-09-11 19:45:22',776] ]);
var options = {
title: 'Free Memory Graph',
curveType: "function",
hAxis: {title: 'Time', titleTextStyle: {color: 'red'}, slantedTextAngle: 90, showTextEvery: 150}
};
var chart = new google.visualization.LineChart(document.getElementById('chart_div2'));
chart.draw(data, options);
}
</script>
</head>
<body>
<center>
My_laptop_Toshiba_M65 192.168.10.39 Intel(R)_Pentium(R)_M_processor_2.00GHz<br><table border="1">
<tr>
<td width=200px valign="top" >
<center>
Menu
<br><br>
<a href="/">Αρχική</a>
</center>
</td><td>
<div id="chart_div" style="width: 500px; height: 180px;"></div>
<div id="chart_div2" style="width: 500px; height: 180px;"></div>
<div id="chart_div5" style="width: 500px; height: 180px;"></div>
</td><td>
<div id="chart_div3" style="width: 500px; height: 180px;"></div>
<div id="chart_div4" style="width: 500px; height: 180px;"></div>
<div id="chart_div6" style="width: 500px; height: 180px;"></div>
</td></table>
</center>
</body>
</html>
από pmav99 » 11 Σεπ 2012, 23:13
από leonidas » 12 Σεπ 2012, 00:23
από simosx » 12 Σεπ 2012, 01:23
the_eye έγραψε:
Δες τον html κώδικα για να έχεις και τα data της mysql (Βάλε τον κώδικα σε ένα αρχείο html για να τον δεις)
Στην 1η function έχω τα δεδομένα σε μορφή 13923928383
<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 = new google.visualization.DataTable();
var d1 = new Date(2005, 10, 20, 13, 20);
var d2 = new Date(2006, 11, 10, 10, 10);
var d3 = new Date(2008, 12, 24, 23, 50);
// Declare columns
data.addColumn('string', 'Employee Name');
data.addColumn('datetime', 'Hire Date');
// Add data.
data.addRows([
['Mike', {v:d1, f:'February 28, 2008'}], // Example of specifying actual and formatted values.
['Bob', d2], // More typically this would be done using a
['Fritz', d3]
]);
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, {legend: 'bottom'});
}
</script>
</head>
<body>
<div id="chart_div" style="width: 900px; height: 500px;"></div>
</body>
</html>από the_eye » 12 Σεπ 2012, 02:10