step1. เริ่มจากสร้างฐานข้อมูลที่ชื่อ fusion-test [Download] และสร้างตารางที่ชื่อ data1 และเพิ่มข้อมูลลงไปตามรูปครับ
step2. โหลดกราฟ [download] และ unzip ไว้ในเวป root โดยของผมจะเก็บไว้ที่นี่ C:\AppServ\www\FusionCharts_Evaluation\ จากนั้นก็ลองเรียกดูเลยครับตาม path นี้
http://localhost/FusionCharts_Evaluation/Code/PHP/DBExample/Default.php
ถ้ารันได้แบบนี้ก็โอเคแล้วครับ
หมายเหตุ กราฟที่ผมให้โหลดเป็นตัวที่ผมตัดบางส่วนออกเอาเฉพาะไฟล์ที่เกี่ยวข้องเท่านั้นและแก้ไขเรียบร้อยแล้วน่ะครับโดยใครอยากโหลดเอาไฟล์ทั้งหมดทุกภาษาสามารถโหลดได้ที่เวปนี้ www.fusioncharts.com
โดยกราฟที่ผมต้องการแสดงคือ แสดงจำนวนที่เหลือของสินค้าแต่ละประเภท
ไฟล์ที่ผมแก้ไขมีตามนี้ครับ
1.ไปที่ C:\AppServ\www\FusionCharts_Evaluation\Code\PHP\Includes แก้ไฟล์ DBConn.php ตามนี้
$hostdb = 'localhost'; // MySQl host $userdb = 'root'; // MySQL username $passdb = 'Your-Password'; // MySQL password ถ้าไม่มีก็ใส่ '' $namedb = 'fusion-test'; // MySQL database name
2.ไปที่ C:\AppServ\www\FusionCharts_Evaluation\Code\PHP\DBExample แก้ไฟล์ Default.php ตามนี้
$strQuery = "select distinct(type) as type_name , sum(amount) as count_amt
from data1
group by type_name"; $strXML .= "<set label='" . $ors2['type_name'] .
"' value='" . $ors2['count_amt'] . "' />";
และหากต้องการเปลี่ยนกราฟแท่งก็แค่แก้ตรงคำสั่ง เปลี่ยนจาก Pie3D.swf เป็น Column3D.swf ตามนี้
echo renderChart("../../FusionCharts/Column3D.swf",
"", $strXML, "FactorySum", 600, 300, false, false);
ที่ต้องแก้หลักๆก็มีแค่นี้ครับ คือ query คำสั่งใหม่ แล้วก็ set ค่า label เพื่อส่งค่า xml ให้ตรงกับ query ไปยังตัวกราฟ
เสร็จแล้วค๊าบ ง่ายป่าว อิอิ
4 comments:
วันนี้เจอเวปนึง http://php-ajax-code.blogspot.com/2007/08/cool-charts-graph-with-ajax-jquery.html it เขียนดีครับแต่ยังไม่ได้ดูรายละเอียดเลย
รบกวนถามหน่อยคะ ถ้าจะให้ขนาดแท่งของกราฟแท่งเล็กลงกว่านี้ต้องกำหนดที่ใดคะ แล้วตรงชื่อชนิดสินค้าอยากให้เอียงเวลาแสดงกำหนดตรงไหนคะ
สอบถามหน่อย ครับ เหมือน คอมเม้นข้างบน เราสามารถ สร้าง เป็น กราฟ เส้น ได้รึเปล่า ครับ ขอบคุณ ล่วงหน้า ครับ
Post a Comment