Forgot Password ??

PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone

	Registered : 109,027

HOME > PHP > PHP Forum > สอบถามผู้รู้เกี่ยวกับ Google Chart ครับ ถ้าอยากสร้าง event select แล้วให้แสดงข้อมูล ต้องทำยังไง

สอบถามผู้รู้เกี่ยวกับ Google Chart ครับ ถ้าอยากสร้าง event select แล้วให้แสดงข้อมูล ต้องทำยังไง

เริ่มหัวข้อใหม่

iamharin

โพสกระทู้ ( 10 )
บทความ ( 0 )

จากตัวอย่าง ผมอยาก ให้คลิ๊กที่ column แล้ว ให้ popup หรือ เปิดหน้าใหม่ ที่แสดงรายการ ของข้อมูล ว่า ใน column ที่คลิ๊กนั้น มีอะไร โดยส่ง ตัวแปร ไปให้ form ที่ทำไว้ มาแสดง ผมต้องเขียนแบบไหนครับ

Tag : PHP, MySQL, HTML/CSS, jQuery, JAVA

ประวัติการแก้ไข
2016-04-27 09:51:22

Date : 2016-04-27 09:45:18

By : iamharin

View : 842

Reply : 5

No. 1

ALTELMA

โพสกระทู้ ( 752 )
บทความ ( 3 )

Code (JavaScript)

google.visualization.events.addListener(chart, 'select', selectHandler);

function selectHandler() {
     // #code
}

Date : 2016-04-27 09:49:07

By : ALTELMA

No. 2

Guest

ลองทำตามแล้วครับ ติดตรง ผมจะ ส่ง ค่า level ตามแต่ ละ column ที่ click ออกมายังไง ครับ

Code (PHP)

	$sql="
	select rm_level_id as level,
	(select count(*) from rm_report where level=a.rm_level_id $sdep1 date between '$ya-10-01' and '$yb-09-30') as total2 
	from rm_level a";

	$result=mysql_query($sql,$conn) or die ("เอ็กซิคิวต์คำสั่งไม่ได้");
	while ($rs=mysql_fetch_array($result)){
		$level=$rs['level'];
		$total2=$rs['total2'];
		$dataset_level1[]="['$level',$total2]";
	}
$data_level=implode(",",$dataset_level1);
?>

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-874" />
<title>Google Chart</title>
<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();
		data.addColumn('string','ระดับความเสี่ยง');
		data.addColumn('number','<?=$yb+543;?>');
		data.addRows([<?php echo $data_level?>]);
				
		var view = new google.visualization.DataView(data);
		view.setColumns([0, 1,
                       { calc: "stringify",
                         sourceColumn: 1,
                         type: "string",
                         role: "annotation" }]);
		
		var options={
			width:510,height:250,
			title:'แผนภูมิแสดงจำนวนรายงานอุบัติการณ์ ทั้งหมดของ <?=$dep_name;?> แยกตามระดับ ปีงบ <?=$yb+543;?>', titleTextStyle: {color: '#FF0000'},
			vAxis:{title:'จำนวนรายงาน'},
			hAxis:{title:'ระดับความเสี่ยง'}
		};
		var chart=new google.visualization.ColumnChart(document.getElementById('barchart_values1'));
		chart.draw(view,options);
		google.visualization.events.addListener(chart, 'select', selectHandler);

function selectHandler() {
  window.location.href ='./risk_level_all_popup.php?level=<?.........?>';
}
	}
</script>
</head>
<body>
	<div id="barchart_values1"></div>
</body>
</html>

Date : 2016-04-27 10:49:43

By : หรนทร์

No. 3

iamharin

โพสกระทู้ ( 10 )
บทความ ( 0 )

ตอบความคิดเห็นที่ : 1 เขียนโดย : ALTELMA เมื่อวันที่ 2016-04-27 09:49:07

รายละเอียดของการตอบ ::

$sql="
select rm_level_id as level,
(select count(*) from rm_report where level=a.rm_level_id $sdep1 date between '$ya-10-01' and '$yb-09-30') as total2 
from rm_level a";

$result=mysql_query($sql,$conn) or die ("เอ็กซิคิวต์คำสั่งไม่ได้");
while ($rs=mysql_fetch_array($result)){
$level=$rs['level'];
$total2=$rs['total2'];
$dataset_level1[]="['$level',$total2]";
}
$data_level=implode(",",$dataset_level1);
?>

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-874" />
<title>Google Chart</title>
<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();
data.addColumn('string','ระดับความเสี่ยง');
data.addColumn('number','<?=$yb+543;?>');
data.addRows([<?php echo $data_level?>]);

var view = new google.visualization.DataView(data);
view.setColumns([0, 1,
{ calc: "stringify",
sourceColumn: 1,
type: "string",
role: "annotation" }]);

var options={
width:510,height:250,
title:'แผนภูมิแสดงจำนวนรายงานอุบัติการณ์ ทั้งหมดของ <?=$dep_name;?> แยกตามระดับ ปีงบ <?=$yb+543;?>', titleTextStyle: {color: '#FF0000'},
vAxis:{title:'จำนวนรายงาน'},
hAxis:{title:'ระดับความเสี่ยง'}
};
var chart=new google.visualization.ColumnChart(document.getElementById('barchart_values1'));
chart.draw(view,options);
google.visualization.events.addListener(chart, 'select', selectHandler);

function selectHandler() {
window.location.href ='./risk_level_all_popup.php?level=<?.........?>';
}
}
</script>
</head>
<body>
<div id="barchart_values1"></div>
</body>
</html>

Date : 2016-04-27 11:04:59

By : iamharin

No. 4

iamharin

โพสกระทู้ ( 10 )
บทความ ( 0 )

ได้แล้วครับ ขอบคุณครับ

Code

function selectHandler() {
    var selection = chart.getSelection();
    if (selection.length) {
        var chartlevel = data.getValue(selection[0].row, 0);

          window.location.href ='./risk_level_all_popup.php?level='+chartlevel;
    }

}

Date : 2016-04-27 11:15:15

By : iamharin

No. 5

ALTELMA

โพสกระทู้ ( 752 )
บทความ ( 3 )

Code (JavaScript)

table.getSelection();

อ่านเพิ่มได้ที่นี่จ๊ะ

ประวัติการแก้ไข
2016-04-27 11:52:45

Date : 2016-04-27 11:51:48

By : ALTELMA

ค้นหาข้อมูล

แสดงความคิดเห็น

Re : สอบถามผู้รู้เกี่ยวกับ Google Chart ครับ ถ้าอยากสร้าง event select แล้วให้แสดงข้อมูล ต้องทำยังไง

รายละเอียด

เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง

โดย

อีเมล์

บวกค่าให้ถูก