ให้เรตสมาชิก: 5 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งาน
 

 

      การใส่แผนภูมิวงกลมใน Code ไฟล์ PHP ช่วยให้ผู้ใช้งานแสดงแผนภูมิวงกลมเป็นเปอร์เซ็นต์ได้และนำไปแสดงผลบน Webbrowser (เว็บเบราว์เซอร์) ได้อย่างง่ายด้าย สามารถใส่แผนภูมิวงกลมได้บน html อีกด้วย โดย Google ได้ให้ผู้ใช้งานสามารถดาวน์โหลด Google Chart ได้เลย

 

Code

<html lang="en-US">
<body>

<div id="piechart"></div>

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

<script type="text/javascript">
// Load google charts
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);

// ใส่ข้อมูลลงไปในแผนภูมิวงกลม
function drawChart() {
  var data = google.visualization.arrayToDataTable([
  ['Task', 'Hours per Day'],
  ['Work', 8],
  ['Eat', 2],
  ['TV', 2],
  ['Gym', 3],
  ['Sleep', 9]
]);

  // ชื่อหัข้อวงกลม ขนาด และความสูงของแผนภูมิวงกลม
  var options = {'title':'ชีวิตประจำวัน', 'width':550, 'height':400};

  // Display the chart inside the <div> element with id="piechart"
  var chart = new google.visualization.PieChart(document.getElementById('piechart'));
  chart.draw(data, options);
}
</script>

</body>
</html>

 

ผลลัพธ์

แผนภูมิ
แผนภูมิ

 

อ้างอิง : w3schools 

 

ข่าวสารเพิ่มเติมเกี่ยวกับ Google

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
งานประจำวันที่ 6 มิถุนายน 2563
โดย bolue ส 06 มิ.ย. 2020 9:57 am บอร์ด M104 - สุภาภรณ์ อินกรรไกร
6
21
ส 06 มิ.ย. 2020 6:11 pm โดย bolue
ส่วนสำคัญของใบกำกับภาษี
โดย natthanit.r2538 ส 06 มิ.ย. 2020 5:56 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
16
ส 06 มิ.ย. 2020 5:56 pm โดย natthanit.r2538
วิธีการ ไล่สีพื้นหลัง โดย css
โดย bolue ส 06 มิ.ย. 2020 5:03 pm บอร์ด CSS Knowledge
0
11
ส 06 มิ.ย. 2020 5:03 pm โดย bolue
วิธีการสร้าง nav-tabs โดย bootstrap
โดย bolue ส 06 มิ.ย. 2020 4:52 pm บอร์ด Booststap Knowledge
0
25
ส 06 มิ.ย. 2020 4:52 pm โดย bolue
วิธีกดภาพ เล็กด้านข้าง แล้วโชว์ภาพใหญ่ ในพื้นที่ดำๆ โดยใช้ javascript
โดย bolue ส 06 มิ.ย. 2020 4:24 pm บอร์ด Jquery & Ajax Knowledge
0
24
ส 06 มิ.ย. 2020 4:24 pm โดย bolue
B- แจ้งปัญหาจากการใช้ระบบเช่าสถานที่ ออกรายงานข้อมูลลูกค้าค้างชำระรวม(แยกตามลูกค้า) ไม่ได้
โดย natthanit.r2538 ส 06 มิ.ย. 2020 4:24 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
1
6
ส 06 มิ.ย. 2020 4:51 pm โดย natthanit.r2538
B- แจ้งปัญหาจากการใช้ระบบเช่าสถานที่ พิมพ์ใบเสร็จไม่ได้
โดย natthanit.r2538 ส 06 มิ.ย. 2020 3:57 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
4
ส 06 มิ.ย. 2020 3:57 pm โดย natthanit.r2538
B- แจ้งปัญหาจากการใช้ระบบเช่าสถานที่ ออกรายงานการขายแล้วไม่พบข้อมูล
โดย natthanit.r2538 ส 06 มิ.ย. 2020 3:35 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
4
12
ส 06 มิ.ย. 2020 4:26 pm โดย natthanit.r2538
B - หน้า admin สร้าง User เเล้วเจอ error
โดย thatsawan ส 06 มิ.ย. 2020 3:05 pm บอร์ด มารียา ซีฟู้ดส์ - Tester
0
1
ส 06 มิ.ย. 2020 3:05 pm โดย thatsawan
G - ไกด์การสรา้ง Line@ และ Menu ใน Line
โดย thatsawan ส 06 มิ.ย. 2020 1:11 pm บอร์ด มารียา ซีฟู้ดส์ - Tester
4
9
ส 06 มิ.ย. 2020 5:54 pm โดย thatsawan
G - ไกด์การสร้าง Shop ในส่วนของ admin
โดย thatsawan ส 06 มิ.ย. 2020 1:07 pm บอร์ด มารียา ซีฟู้ดส์ - Tester
2
4
ส 06 มิ.ย. 2020 5:54 pm โดย thatsawan
แจ้งปัญหาการการสั่งพิมพ์ใบเสร็จไม่ได้
โดย natthanit.r2538 ส 06 มิ.ย. 2020 12:01 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS, CRM
0
29
ส 06 มิ.ย. 2020 12:01 pm โดย natthanit.r2538
กดภาพเล็กๆ ด้านข้าง แล้วโชว์ภาพใหญ่ ในพื้นที่ดำๆ ทำยังไง
โดย bolue ส 06 มิ.ย. 2020 11:20 am บอร์ด JavaScript & Jquery Ajax
1
23
ส 06 มิ.ย. 2020 4:27 pm โดย bolue
R - งานออกแบบหน้าจอ bootstrap หน้าโปรไฟล์
โดย bolue ส 06 มิ.ย. 2020 10:21 am บอร์ด M104 - สุภาภรณ์ อินกรรไกร
6
21
ส 06 มิ.ย. 2020 3:39 pm โดย bolue
งานประจำวันที่ 6 มิถุนายน 2563
โดย natthanit.r2538 ส 06 มิ.ย. 2020 9:58 am บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
4
15
ส 06 มิ.ย. 2020 7:56 pm โดย natthanit.r2538
Celeb net worth?
โดย Bailey99 ศ 05 มิ.ย. 2020 7:03 pm บอร์ด PHP Knowledge
1
28
ศ 05 มิ.ย. 2020 7:28 pm โดย rajneeskumar
วิธีการ ใช้งาน vuetify คู่กับ vue.js
โดย bolue ศ 05 มิ.ย. 2020 6:02 pm บอร์ด CSS Knowledge
0
15
ศ 05 มิ.ย. 2020 6:02 pm โดย bolue
วิธีการ ติดตั้ง vue.js สำหรับผู้เริ่มต้น หัดเขียน สอนติดตั้ง
โดย bolue ศ 05 มิ.ย. 2020 4:55 pm บอร์ด Jquery & Ajax Knowledge
0
38
ศ 05 มิ.ย. 2020 4:55 pm โดย bolue
วิธีการ ใช้ Grid ออกแบบเป็น responsive design โดย vuetify
โดย bolue ศ 05 มิ.ย. 2020 3:36 pm บอร์ด CSS Knowledge
0
28
ศ 05 มิ.ย. 2020 3:36 pm โดย bolue
วิธีการ เรียนใช้ dialog จาก components โดย vue.js
โดย bolue ศ 05 มิ.ย. 2020 1:45 pm บอร์ด Jquery & Ajax Knowledge
0
32
ศ 05 มิ.ย. 2020 1:45 pm โดย bolue