| Server IP : 182.53.201.61 / Your IP : 216.73.217.175 Web Server : Apache/2.2.15 (Fedora) System : Linux km10.dyndns.org 2.6.31.5-127.fc12.i686.PAE #1 SMP Sat Nov 7 21:25:57 EST 2009 i686 User : apache ( 48) PHP Version : 5.3.3 Disable Function : NONE MySQL : ON | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : ON | Pkexec : ON Directory : /var/www/html/kpiit/ |
Upload File : |
<?php
//ตั้งค่าการเชื่อมต่อฐานข้อมูล
$database_host = '192.168.1.7';
$database_port = '3333';
$database_username = 'root';
$database_password = '090407';
$database_name = 'mit';
/*$database_host = 'localhost';
$database_username = 'root';
$database_password = '090407';
$database_name = 'chart';*/
$mysqli = new mysqli($database_host, $database_username, $database_password, $database_name, $database_port);
/*$mysqli = new mysqli($database_host, $database_username, $database_password, $database_name);*/
//กำหนด charset ให้เป็น utf8 เพื่อรองรับภาษาไทย
$mysqli->set_charset("utf8");
//กรณีมี Error เกิดขึ้น
if ($mysqli->connect_error) {
die('Error : ('. $mysqli->connect_errno .') '. $mysqli->connect_error);
}
//เรียกข้อมูลจาก ตาราง chart
$get_data = $mysqli->query("SELECT resID,sum(evaluation) FROM report GROUP BY ResID");
while($data = $get_data->fetch_assoc()){
$result[] = $data;
}
// Select Month
$slMonth = Array(1=>"มกราคม",2=>"กุมภาพันธ์",3=>"มีนาคม",4=>"เมษายน",5=>"พฤษภาคม",6=>"มิถุนายน",7=>"กรกฎาคม",8=>"สิงหาคม",9=>"กันยายน",10=>"ตุลาคม",11=>"พฤศจิกายน",12=>"ธันวาคม");
echo "เลือกเดือน : ";
echo "<select name=\"selectMonth\">";
echo "<option value=\"0\">-- ทุกเดือน --</option>";
for ($i=1; $i<=12; $i++)
echo "<option value=\"$i\">".$slMonth[$i]."</option>";
echo "</select>";
echo "<input name=\"submit\" type=\"submit\" value=\" OK \">"; // botton Submit
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>การใช้งาน Highcharts JS With PHP MySQL</title>
<!-- Bootstrap -->
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<h1></h1>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
<table width="30%" border="0" cellpadding="0" cellspacing="3" class="border">
<tr>
<td width="10%" height="20" align="center" bgcolor="#000000" class="txtH">ลำดับ</td>
<td width="25%" height="20" align="center" bgcolor="#000000" class="txtH">ประเภท</td>
<td width="22%" height="20" align="center" bgcolor="#000000" class="txtH">ปีงบประมาณ</td>
<td width="43%" align="center" bgcolor="#000000" class="txtH">วันเวลาที่ซื้อ</td>
</tr>
<?php
$sql = "SELECT * FROM tb_comreport ORDER BY idCom";
$res = mysql_query($sql) or die ("$sql");
while($row = mysql_fetch_array($res)){ // loop data
$bgColor = ($i++ %2) ? '#EFEFEF' : '#FFFFFF'; // loop bgcolor
?>
<tr bgcolor="<?=$bgColor;?>">
<td align="center"><?=$row['idCom'];?></td>
<td><?=$row['desCom'];?></td>
<td align="center"><?=$row['yearCom'];?></td>
<td align="center"><?=$row['dtCom'];?></td>
</tr>
<?php } ?>
</table>
</form>
</body>
</html>
<script src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script>
$(function () {
$('#container').highcharts({
data: {
//กำหนดให้ ตรงกับ id ของ table ที่จะแสดงข้อมูล
table: 'datatable'
},
chart: {
type: 'column'
},
title: {
text: 'ตัวชี้วัดผลการปฏิบัติงาน'
},
yAxis: {
allowDecimals: false,
title: {
text: 'Units'
}
},
tooltip: {
formatter: function () {
return '<b>' + this.series.name + '</b><br/>' +
this.point.y; + ' ' + this.point.name.toLowerCase();
}
}
});
});
</script>
</body>
</html>