Class PieChartBuilder

PieChartBuilder

เครื่องมือสร้างแผนภูมิวงกลม โปรดดูรายละเอียดเพิ่มเติมในเอกสารประกอบของ Google Charts

ต่อไปนี้เป็นตัวอย่างที่แสดงวิธีสร้างแผนภูมิวงกลม ข้อมูลจะนำเข้าจากสเปรดชีตของ Google

  // Get sample data from a spreadsheet.
  var dataSourceUrl = 'https://docs.google.com/spreadsheet/tq?range=A1%3AB8' +
      '&key=0Aq4s9w_HxMs7dHpfX05JdmVSb1FpT21sbXd4NVE3UEE&gid=3&headers=-1';

  var chartBuilder = Charts.newPieChart()
      .setTitle('World Population by Continent')
      .setDimensions(600, 500)
      .set3D()
      .setDataSourceUrl(dataSourceUrl);

  var chart = chartBuilder.build();

วิธีการ

วิธีการ	ประเภทการแสดงผล	รายละเอียดแบบย่อ
build()	Chart	สร้างแผนภูมิ
reverseCategories()	PieChartBuilder	กลับการวาดของอนุกรมในแกนโดเมน
set3D()	PieChartBuilder	ตั้งค่าแผนภูมิให้เป็น 3 มิติ
setBackgroundColor(cssValue)	PieChartBuilder	ตั้งค่าสีพื้นหลังของแผนภูมิ
setColors(cssValues)	PieChartBuilder	ตั้งค่าสีสำหรับเส้นในแผนภูมิ
setDataSourceUrl(url)	PieChartBuilder	ตั้งค่า URL ของแหล่งข้อมูลที่ใช้เพื่อดึงข้อมูลเข้ามาจากแหล่งที่มาภายนอก เช่น Google ชีต
setDataTable(tableBuilder)	PieChartBuilder	ตั้งค่าตารางข้อมูลที่จะใช้สำหรับแผนภูมิโดยใช้ DataTableBuilder
setDataTable(table)	PieChartBuilder	ตั้งค่าตารางข้อมูลที่มีเส้นสำหรับแผนภูมิ และป้ายกำกับแกน X
setDataViewDefinition(dataViewDefinition)	PieChartBuilder	กำหนดมุมมองข้อมูลที่จะใช้กับแผนภูมิ
setDimensions(width, height)	PieChartBuilder	ตั้งค่ามิติข้อมูลสำหรับแผนภูมิ
setLegendPosition(position)	PieChartBuilder	กำหนดตำแหน่งของคำอธิบายตามแผนภูมิ
setLegendTextStyle(textStyle)	PieChartBuilder	ตั้งค่ารูปแบบข้อความของคำอธิบายแผนภูมิ
setOption(option, value)	PieChartBuilder	ตั้งค่าตัวเลือกขั้นสูงสำหรับแผนภูมินี้
setTitle(chartTitle)	PieChartBuilder	ตั้งชื่อของแผนภูมิ
setTitleTextStyle(textStyle)	PieChartBuilder	ตั้งค่ารูปแบบข้อความของชื่อแผนภูมิ

เอกสารประกอบโดยละเอียด

build()

สร้างแผนภูมิ

รีเทิร์น

Chart — ออบเจ็กต์แผนภูมิที่สามารถฝังลงในเอกสาร, องค์ประกอบ UI หรือใช้เป็นภาพนิ่ง

---

reverseCategories()

กลับการวาดของอนุกรมในแกนโดเมน สำหรับแผนภูมิแนวตั้ง (เช่น แผนภูมิเส้น แผนภูมิพื้นที่ หรือคอลัมน์) หมายความว่าแกนแนวนอนจะวาดจากขวาไปซ้าย สำหรับแผนภูมิช่วงแนวนอน (เช่น แผนภูมิแท่ง) หมายความว่าแกนแนวตั้งจะวาดจากบนลงล่าง สำหรับแผนภูมิวงกลม แผนภูมิวงกลมจะวาดทวนเข็มนาฬิกา

// Creates a pie chart builder and sets drawing of the slices in a counter-clockwise manner.
var builder = Charts.newPieChart();
builder.reverseCategories();

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

set3D()

ตั้งค่าแผนภูมิให้เป็น 3 มิติ

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setBackgroundColor(cssValue)

ตั้งค่าสีพื้นหลังของแผนภูมิ

// Creates a line chart builder and sets the background color to gray
var builder = Charts.newLineChart();
builder.setBackgroundColor("gray");

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
cssValue	String	ค่า CSS สำหรับสี (เช่น "blue" หรือ "#00f")

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setColors(cssValues)

ตั้งค่าสีสำหรับเส้นในแผนภูมิ

// Creates a line chart builder and sets the first two lines to be drawn in green and red,
// respectively.
var builder = Charts.newLineChart();
builder.setColors(["green", "red"]);

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
cssValues	String[]	อาร์เรย์ของค่า CSS สี เช่น ["red", "#acf"] องค์ประกอบที่ n ในอาร์เรย์จะแสดงสีของเส้นที่ n ในแผนภูมิ

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setDataSourceUrl(url)

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

ดูข้อมูลเพิ่มเติมเกี่ยวกับการค้นหาแหล่งข้อมูลได้ในเอกสารประกอบของ Google Charts

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
url	String	URL แหล่งข้อมูล รวมถึงพารามิเตอร์การค้นหา

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setDataTable(tableBuilder)

ตั้งค่าตารางข้อมูลที่จะใช้สำหรับแผนภูมิโดยใช้ DataTableBuilder นี่เป็นวิธีที่สะดวกในการตั้งค่าตารางข้อมูลโดยไม่ต้องเรียกใช้ build()

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
tableBuilder	DataTableBuilder	เครื่องมือสร้างตารางข้อมูล ระบบจะสร้างตารางข้อมูลใหม่ขึ้นทันทีที่เป็นส่วนหนึ่งของการเรียกนี้ ดังนั้นการอัปเดตใดๆ เพิ่มเติมของเครื่องมือสร้างจะไม่แสดงในแผนภูมิ

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setDataTable(table)

ตั้งค่าตารางข้อมูลที่มีเส้นสำหรับแผนภูมิ และป้ายกำกับแกน X คอลัมน์แรกควรเป็นสตริง และมีป้ายกำกับแกนแนวนอน หลังจากนั้นจะมีกี่คอลัมน์ก็ได้ แต่ทั้งหมดต้องเป็นตัวเลข แต่ละคอลัมน์จะแสดงเป็นเส้นแยกจากกัน

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
table	DataTableSource	ตารางข้อมูลที่จะใช้สำหรับแผนภูมิ

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setDataViewDefinition(dataViewDefinition)

กำหนดมุมมองข้อมูลที่จะใช้กับแผนภูมิ

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
dataViewDefinition	DataViewDefinition	ออบเจ็กต์คำจำกัดความมุมมองข้อมูลที่กำหนดข้อมูลพร็อพเพอร์ตี้ที่ควรดึงมาจากแหล่งข้อมูลที่ระบุสำหรับภาพวาดแผนภูมิ

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setDimensions(width, height)

ตั้งค่ามิติข้อมูลสำหรับแผนภูมิ

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
width	Integer	ความกว้างของแผนภูมิเป็นพิกเซล
height	Integer	ความสูงของแผนภูมิเป็นพิกเซล

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setLegendPosition(position)

กำหนดตำแหน่งของคำอธิบายตามแผนภูมิ โดยค่าเริ่มต้น จะไม่มีคำอธิบาย

// Creates a line chart builder and sets the legend position to right.
var builder = Charts.newLineChart();
builder.setLegendPosition(Charts.Position.RIGHT);

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
position	Position	ตำแหน่งของคำอธิบาย

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setLegendTextStyle(textStyle)

ตั้งค่ารูปแบบข้อความของคำอธิบายแผนภูมิ

// Creates a line chart builder and sets it up for a  blue, 26-point legend.
var textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26);
var style = textStyleBuilder.build();
var builder = Charts.newLineChart();
builder.setLegendTextStyle(style);

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
textStyle	TextStyle	รูปแบบข้อความที่จะใช้สำหรับคำอธิบายแผนภูมิ

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setOption(option, value)

ตั้งค่าตัวเลือกขั้นสูงสำหรับแผนภูมินี้ ดูตัวเลือกที่ใช้ได้สำหรับแผนภูมินี้ วิธีนี้จะไม่มีผลหากตัวเลือกที่ระบุไม่ถูกต้อง

// Build a pie chart with a pretty legend.
var builder = Charts.newPieChart();
builder.setOption('legend', {textStyle: {color: 'blue', fontSize: 16}});
var chart = builder.build();

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
option	String	ตัวเลือกในการตั้งค่า
value	Object	ค่าที่จะตั้งค่า

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setTitle(chartTitle)

ตั้งชื่อของแผนภูมิ ชื่อจะแสดงตรงกลางเหนือแผนภูมิ

// Creates a line chart builder and title to 'My Line Chart'.
var builder = Charts.newLineChart();
builder.setTitle('My Line Chart')

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
chartTitle	String	ชื่อแผนภูมิ

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน

---

setTitleTextStyle(textStyle)

ตั้งค่ารูปแบบข้อความของชื่อแผนภูมิ

// Creates a line chart builder and sets it up for a  blue, 26-point title.
var textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26);
var style = textStyleBuilder.build();
var builder = Charts.newLineChart();
builder.setTitleTextStyle(style);

พารามิเตอร์

ชื่อ	Type	คำอธิบาย
textStyle	TextStyle	รูปแบบข้อความที่จะใช้เป็นชื่อแผนภูมิ คุณสร้างออบเจ็กต์ TextStyleBuilder ได้โดยเรียกใช้ Charts.newTextStyle()

รีเทิร์น

PieChartBuilder — เครื่องมือสร้างนี้มีประโยชน์ต่อการทำเชน