ตัวเลือกการกำหนดค่าแผนภูมิ

ประเภทแผนภูมิ

ตัวเลือกการกําหนดค่าแผนภูมิคําอธิบายประกอบ

ชื่อ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
displayRangeSelector

แสดงพื้นที่การเลือกช่วงการซูม (พื้นที่ที่ด้านล่างของแผนภูมิ) หรือไม่ โดยที่ false หมายถึงไม่

เส้นขอบในตัวเลือกการซูมคืออนุกรมแรกของแผนภูมิในเวอร์ชันสเกลเชิงลอน ซึ่งปรับขนาดให้พอดีกับความสูงของตัวเลือกการซูม

ประเภท: boolean
ค่าเริ่มต้น: true
displayZoomButtons

กำหนดว่าจะแสดงปุ่มซูม ("1 วัน 5 วัน 1 เดือน" และอื่นๆ) หรือไม่ โดยที่ false หมายถึงไม่

ประเภท: boolean
ค่าเริ่มต้น: true
สูงสุด

ค่าสูงสุดที่จะแสดงบนแกน Y หากจุดข้อมูลสูงสุดเกินค่านี้ ระบบจะไม่สนใจการตั้งค่านี้ และปรับแผนภูมิให้แสดงเครื่องหมายแท่งหลักถัดไปเหนือจุดข้อมูลสูงสุด ซึ่งจะมีความสำคัญเหนือกว่าค่าสูงสุดของแกน Y ที่ scaleType กำหนด

ซึ่งคล้ายกับ maxValue ในแผนภูมิหลัก

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
นาที

ค่าต่ำสุดที่จะแสดงบนแกน Y หากจุดข้อมูลต่ำสุดน้อยกว่าค่านี้ ระบบจะไม่สนใจการตั้งค่านี้ และปรับแผนภูมิให้แสดงเครื่องหมายแท่งหลักถัดไปใต้จุดข้อมูลต่ำสุด ซึ่งจะมีความสำคัญเหนือกว่าค่าต่ำสุดบนแกน Y ที่ระบุโดย scaleType

ซึ่งคล้ายกับ minValue ในแผนภูมิหลัก

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ

ตัวเลือกการกําหนดค่าแผนภูมิพื้นที่

ชื่อ
areaOpacity

ความทึบแสงเริ่มต้นของพื้นที่สีใต้ชุดแผนภูมิพื้นที่ ซึ่ง 0.0 หมายถึงโปร่งแสงทั้งหมด และ 1.0 หมายถึงทึบแสงสนิท หากต้องการระบุระดับความทึบของซีรีส์แต่ละรายการ ให้ตั้งค่า areaOpacity ในพร็อพเพอร์ตี้ series

ประเภท: number, 0.0- 1.0
ค่าเริ่มต้น: 0.3
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของส่วนที่เป็นพื้นในแผนภูมิในรูปแบบสตริงสี HTML

ประเภท: string
ค่าเริ่มต้น: 'white'
chartArea

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าตําแหน่งและขนาดของพื้นที่แผนภูมิ (ที่วาดแผนภูมิเอง ยกเว้นแกนนอนและลําดับชั้น) ระบบรองรับ 2 รูปแบบ ได้แก่ ตัวเลขหรือตัวเลขตามด้วย % ตัวเลขธรรมดาคือค่าในพิกเซล ส่วนตัวเลขตามด้วย % คือเปอร์เซ็นต์ ตัวอย่าง: chartArea:{left:20,top:0,width:'50%',height:'75%'}

ประเภท: object
ค่าเริ่มต้น: null
chartArea.backgroundColor
สีพื้นหลังของพื้นที่แผนภูมิ เมื่อใช้สตริง สตริงดังกล่าวอาจเป็นสตริงฐาน 16 (เช่น '#fdc') หรือชื่อสีภาษาอังกฤษ เมื่อใช้ออบเจ็กต์ คุณสามารถระบุพร็อพเพอร์ตี้ต่อไปนี้ได้
  • stroke: สีที่ระบุเป็นสตริงฐาน 16 หรือชื่อสีภาษาอังกฤษ
  • strokeWidth: หากระบุไว้ ให้วาดเส้นขอบรอบๆ พื้นที่แผนภูมิที่มีความกว้างที่ระบุ (และด้วยสีของ stroke)
ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
chartArea.height

ความสูงของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.left

ระยะห่างระหว่างเส้นขอบด้านซ้ายกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.top

ระยะห่างระหว่างเส้นขอบด้านบนกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.width

ความกว้างของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
hAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบในแนวนอนต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
hAxis.direction

ทิศทางที่ค่าตามแกนแนวนอนเพิ่มขึ้น ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
hAxis.gridlines

ออบเจ็กต์ที่มีพร็อพเพอร์ตี้ในการกําหนดค่าเส้นตารางในแนวนอน โปรดทราบว่าเส้นตารางแกนแนวนอนจะวาดในแนวตั้ง หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.gridlines.color

สีของเส้นตารางแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
hAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
hAxis.logScale

พร็อพเพอร์ตี้ hAxis ที่ทำให้แกนนอนเป็นมาตราส่วนเชิงลําดับเลข (ค่าทั้งหมดต้องเป็นค่าบวก) ตั้งค่าเป็น true สำหรับ "ใช่"

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
hAxis.maxValue

ย้ายค่าสูงสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ด้านขวาในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า x สูงสุดของข้อมูล hAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนนอน ซึ่งคล้ายกับตัวเลือก hAxis.gridlines

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
hAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 ตอนนี้จำนวนเส้นกริดย่อยจะขึ้นอยู่กับช่วงเวลาระหว่างเส้นกริดหลัก (ดู hAxis.gridlines.interval) และพื้นที่ขั้นต่ำที่ต้องการ (ดู hAxis.minorGridlines.minSpacing) ทั้งหมด

ประเภท: number
ค่าเริ่มต้น: 1
hAxis.minValue

ย้ายค่าต่ำสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เลื่อนไปทางซ้ายในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า x ขั้นต่ำของข้อมูล hAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.textPosition

ตำแหน่งของข้อความแกนแนวนอนสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
hAxis.textStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความของแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

hAxis พร็อพเพอร์ตี้ที่ระบุชื่อแกนแนวนอน

ประเภท: string
ค่าเริ่มต้น: null
hAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวนอน

ประเภท: object
ค่าเริ่มต้น: null
hAxis.viewWindow.max

ค่าข้อมูลแนวนอนสูงสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.viewWindow.min

ค่าข้อมูลแนวนอนต่ำสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
interpolateNulls

เลือกว่าจะเดาค่าของคะแนนที่ขาดไปหรือไม่ หากเป็น true ระบบจะคาดคะเนค่าของข้อมูลที่ขาดหายไปโดยอิงตามจุดใกล้เคียง หากเป็น false ระบบจะเว้นวรรคในบรรทัด ณ จุดที่ไม่รู้จัก

แผนภูมิพื้นที่ที่มีตัวเลือก isStacked: true/'percent'/'relative'/'absolute' ไม่รองรับตัวเลือกนี้

ประเภท: boolean
ค่าเริ่มต้น: false
isStacked

หากตั้งค่าเป็น true ระบบจะซ้อนองค์ประกอบของทุกชุดค่ายที่ค่าโดเมนแต่ละค่า หมายเหตุ: ในแผนภูมิคอลัมน์ พื้นที่ และ SteppedArea Google Charts จะกลับลําดับของรายการในแผนภูมิเพื่อให้สอดคล้องกับการซ้อนขององค์ประกอบชุดค่างําได้ดีขึ้น (เช่น ชุดที่ 0 จะเป็นรายการในแผนภูมิที่ต่ำที่สุด) กฎนี้ ไม่มีผล กับแผนภูมิแท่ง

ตัวเลือก isStacked ยังรองรับการซ้อน 100% ด้วย โดยระบบจะปรับขนาดกององค์ประกอบที่ค่าโดเมนแต่ละค่าใหม่เพื่อให้รวมกันได้ 100%

ตัวเลือกสำหรับ isStacked มีดังนี้

  • false — องค์ประกอบจะไม่ซ้อนกัน ประเภทการทำงานนี้เป็นค่าเริ่มต้น
  • true — ซ้อนองค์ประกอบของชุดข้อมูลทั้งหมดที่ค่าโดเมนแต่ละค่า
  • 'percent' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 100% โดยค่าขององค์ประกอบแต่ละรายการจะคํานวณเป็นเปอร์เซ็นต์ของ 100%
  • 'relative' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 1 โดยค่าของแต่ละองค์ประกอบจะคํานวณเป็นเศษส่วนของ 1
  • 'absolute' — ทำงานเหมือนกับ isStacked: true

สําหรับการซ้อน 100% ค่าที่คำนวณแล้วของแต่ละองค์ประกอบจะปรากฏในเคล็ดลับเครื่องมือหลังค่าจริง

ค่าเริ่มต้นของแกนเป้าหมายจะเป็นค่าขีดตามสเกล 0-1 แบบสัมพัทธ์เป็นเศษส่วนของ 1 สำหรับ 'relative' และ 0-100% สำหรับ 'percent' (หมายเหตุ: เมื่อใช้ตัวเลือก 'percent' ค่าแกน/ขีดจะแสดงเป็นเปอร์เซ็นต์ แต่ค่าจริงคือค่าสเกล 0-1 แบบสัมพัทธ์ เนื่องจากเครื่องหมายบนแกนเปอร์เซ็นต์เป็นผลมาจากการใช้รูปแบบ "#.##%" กับค่าสเกล 0-1 แบบสัมพัทธ์ เมื่อใช้ isStacked: 'percent' โปรดตรวจสอบว่าได้ระบุเครื่องหมาย/เส้นตารางโดยใช้ค่าสเกลแบบสัมพัทธ์ 0-1) คุณปรับแต่งเส้นตาราง/ค่าการแบ่งแท่งและการจัดรูปแบบได้โดยใช้ตัวเลือก hAxis/vAxis ที่เหมาะสม

การซ้อน 100% รองรับเฉพาะค่าข้อมูลประเภท number เท่านั้น และต้องมีค่าฐานเป็น 0

ประเภท: boolean/string
ค่าเริ่มต้น: false
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legend.position

ตำแหน่งของคำอธิบาย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'bottom' - ใต้แผนภูมิ
  • 'left' - ทางด้านซ้ายของแผนภูมิในกรณีที่แกนด้านซ้ายไม่มี series เชื่อมโยงอยู่ ดังนั้นหากต้องการให้คำอธิบายทางด้านซ้าย ให้ใช้ตัวเลือก targetAxisIndex: 1
  • 'in' - ภายในแผนภูมิ ตรงมุมซ้ายบน
  • 'none' - ไม่มีการระบุแหล่งที่มา
  • 'right' - ทางด้านขวาของแผนภูมิ ใช้ร่วมกับตัวเลือก vAxes ไม่ได้
  • 'top' - เหนือแผนภูมิ
ประเภท: string
ค่าเริ่มต้น: 'right'
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
lineWidth

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

ประเภท: number
ค่าเริ่มต้น: 2
pointShape

รูปร่างขององค์ประกอบข้อมูลแต่ละรายการ: 'circle', 'triangle', 'square', 'diamond', 'star' หรือ 'polygon' ดูตัวอย่างได้ใน เอกสารประกอบเกี่ยวกับคะแนน

ประเภท: string
ค่าเริ่มต้น: 'circle'
pointSize

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

ประเภท: number
ค่าเริ่มต้น: 0
reverseCategories

หากตั้งค่าเป็น true ระบบจะวาดชุดจากขวาไปซ้าย ค่าเริ่มต้นคือวาดจากซ้ายไปขวา

ตัวเลือกนี้ใช้ได้กับแกน discrete major เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
ซีรีส์

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

  • annotations - ออบเจ็กต์ที่จะใช้กับคำอธิบายประกอบของชุดนี้ ตัวอย่างการใช้เพื่อควบคุม textStyle ของชุดหนังสือมีดังนี้

    series: {
      0: {
        annotations: {
          textStyle: {fontSize: 12, color: 'red' }
        }
      }
    }
              

    ดูตัวเลือก annotations ต่างๆ เพื่อดูรายการที่ปรับแต่งได้ทั้งหมด

  • areaOpacity - ลบล้าง areaOpacity ระดับส่วนกลางสำหรับชุดนี้
  • color - สีที่จะใช้กับชุดข้อมูลนี้ ระบุสตริงสี HTML ที่ถูกต้อง
  • labelInLegend - คําอธิบายชุดที่จะปรากฏในคําอธิบายแผนภูมิ
  • lineDashStyle - ลบล้างค่า lineDashStyle ระดับส่วนกลางสำหรับชุดนี้
  • lineWidth - ลบล้างค่า lineWidth ระดับส่วนกลางสำหรับชุดนี้
  • pointShape - ลบล้างค่า pointShape ระดับส่วนกลางสำหรับชุดนี้
  • pointSize - ลบล้างค่า pointSize ระดับส่วนกลางสำหรับชุดนี้
  • pointsVisible - ลบล้างค่า pointsVisible ระดับส่วนกลางสำหรับชุดนี้
  • targetAxisIndex - แกนที่จะกำหนดชุดข้อมูลนี้ โดยที่ 0 คือแกนเริ่มต้น และ 1 คือแกนตรงข้าม ค่าเริ่มต้นคือ 0 ให้ตั้งค่าเป็น 1 เพื่อกําหนดแผนภูมิที่แสดงผลชุดข้อมูลต่างๆ บนแกนต่างๆ คุณต้องจัดสรรชุดค่าอย่างน้อย 1 ชุดให้กับแกนเริ่มต้น คุณกําหนดมาตราส่วนที่แตกต่างกันสําหรับแกนต่างๆ ได้
  • visibleInLegend - ค่า boolean โดยที่ true หมายความว่าชุดข้อมูลควรมีรายการคำอธิบายประกอบ และ false หมายความว่าไม่ควรมี ค่าเริ่มต้นคือ true

คุณสามารถระบุอาร์เรย์ของออบเจ็กต์ โดยแต่ละรายการจะมีผลกับชุดหนังสือตามลำดับที่ระบุ หรือจะระบุออบเจ็กต์ที่มีออบเจ็กต์ย่อยแต่ละรายการมีคีย์ตัวเลขที่ระบุชุดหนังสือที่ใช้ก็ได้ ตัวอย่างเช่น การประกาศ 2 รายการต่อไปนี้เหมือนกัน และประกาศชุดที่ 1 เป็นสีดําและไม่มีในคําอธิบายประกอบ และชุดที่ 4 เป็นสีแดงและไม่มีในคําอธิบายประกอบ

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ที่ฝังอยู่
ค่าเริ่มต้น: {}
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ธีม [theme]

ธีมคือชุดค่าตัวเลือกที่กําหนดไว้ล่วงหน้าซึ่งทํางานร่วมกันเพื่อให้ได้ลักษณะการทํางานของแผนภูมิหรือเอฟเฟกต์ภาพที่ต้องการ ปัจจุบันมีธีมเดียวที่ใช้ได้ ดังนี้

  • 'maximized' - ขยายพื้นที่ของแผนภูมิให้ใหญ่ที่สุด และวาดคําอธิบายแผนภูมิและป้ายกำกับทั้งหมดภายในพื้นที่แผนภูมิ
ประเภท: string
ค่าเริ่มต้น: null
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
treatLabelsAsText

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์นั้นเป็นคอลัมน์ข้อความ

ประเภท: boolean
useFirstColumnAsDomain

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์เป็นโดเมน

ประเภท: boolean
vAxes

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

หากต้องการระบุแผนภูมิที่มีแกนแนวตั้งหลายแกน ให้กําหนดแกนใหม่โดยใช้ series.targetAxisIndex ก่อน แล้วกําหนดค่าแกนโดยใช้ vAxes ตัวอย่างต่อไปนี้กำหนดชุดที่ 2 ให้กับแกนขวา และระบุชื่อและสไตล์ข้อความที่กำหนดเอง

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

พร็อพเพอร์ตี้นี้อาจเป็นออบเจ็กต์หรืออาร์เรย์ก็ได้ โดยออบเจ็กต์คือคอลเล็กชันของออบเจ็กต์ ซึ่งแต่ละรายการจะมีป้ายกำกับตัวเลขที่ระบุแกนที่กำหนด ซึ่งก็คือรูปแบบที่แสดงด้านบน ส่วนอาร์เรย์คืออาร์เรย์ของออบเจ็กต์ 1 รายการต่อแกน ตัวอย่างเช่น รูปแบบอาร์เรย์ต่อไปนี้จะเหมือนกับออบเจ็กต์ vAxis ที่แสดงด้านบน

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ย่อย
ค่าเริ่มต้น: null
vAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบแกนแนวตั้งต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
ประเภท: object
ค่าเริ่มต้น: null
vAxis.direction

ทิศทางที่ค่าตามแกนแนวตั้งเพิ่มขึ้น โดยค่าเริ่มต้น ค่าต่ำจะอยู่ที่ด้านล่างของแผนภูมิ ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
vAxis.gridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นตารางในแนวตั้ง โปรดทราบว่าเส้นตารางแกนแนวตั้งจะวาดในแนวนอน หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
vAxis.gridlines.color

สีของเส้นตารางแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
vAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
vAxis.logScale

หากเป็น true จะทำให้แกนแนวตั้งเป็นมาตราส่วนเชิงลอนจิทูด หมายเหตุ: ค่าทั้งหมดต้องเป็นค่าบวก

ประเภท: boolean
ค่าเริ่มต้น: false
vAxis.maxValue

ย้ายค่าสูงสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เพิ่มขึ้นในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า y สูงสุดของข้อมูล vAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนแนวตั้ง ซึ่งคล้ายกับตัวเลือก vAxis.gridlines

ประเภท: object
ค่าเริ่มต้น: null
vAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
vAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 จำนวนเส้นกริดย่อยจะขึ้นอยู่กับระยะห่างระหว่างเส้นกริดหลักและพื้นที่ขั้นต่ำที่ต้องการ

ประเภท: number
ค่าเริ่มต้น: 1
vAxis.minValue

ย้ายค่าต่ำสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ลดลงในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า y ขั้นต่ำของข้อมูล vAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: null
vAxis.textPosition

ตำแหน่งของข้อความแกนแนวตั้งสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
vAxis.textStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความของแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

ระบุชื่อแกนแนวตั้ง

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
vAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวตั้ง

ประเภท: object
ค่าเริ่มต้น: null
vAxis.viewWindow.max

ค่าข้อมูลแนวตั้งสูงสุดที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.viewWindow.min

ค่าข้อมูลแนวตั้งขั้นต่ำที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ

ตัวเลือกการกำหนดค่าแผนภูมิแท่ง

ชื่อ
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของพื้นที่ในแผนภูมิเป็นสตริงสี HTML

ประเภท:string
ค่าเริ่มต้น: 'white'
chartArea

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าตําแหน่งและขนาดของพื้นที่แผนภูมิ (ที่วาดแผนภูมิเอง ยกเว้นแกนนอนและลําดับชั้น) ระบบรองรับ 2 รูปแบบ ได้แก่ ตัวเลขหรือตัวเลขตามด้วย % ตัวเลขธรรมดาคือค่าในพิกเซล ส่วนตัวเลขตามด้วย % คือเปอร์เซ็นต์ ตัวอย่าง: chartArea:{left:20,top:0,width:'50%',height:'75%'}

ประเภท: object
ค่าเริ่มต้น: null
chartArea.backgroundColor
สีพื้นหลังของพื้นที่แผนภูมิ เมื่อใช้สตริง สตริงดังกล่าวอาจเป็นสตริงฐาน 16 (เช่น '#fdc') หรือชื่อสีภาษาอังกฤษ เมื่อใช้ออบเจ็กต์ คุณสามารถระบุพร็อพเพอร์ตี้ต่อไปนี้ได้
  • stroke: สีที่ระบุเป็นสตริงฐาน 16 หรือชื่อสีภาษาอังกฤษ
  • strokeWidth: หากระบุไว้ ให้วาดเส้นขอบรอบๆ พื้นที่แผนภูมิที่มีความกว้างที่ระบุ (และด้วยสีของ stroke)
ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
chartArea.height

ความสูงของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.left

ระยะห่างระหว่างเส้นขอบด้านซ้ายกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.top

ระยะห่างระหว่างเส้นขอบด้านบนกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.width

ความกว้างของพื้นที่แผนภูมิ

ประเภท: ตัวเลขหรือ string
ค่าเริ่มต้น: อัตโนมัติ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
hAxes

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

หากต้องการระบุแผนภูมิที่มีแกนนอนหลายแกน ให้กําหนดแกนใหม่โดยใช้ series.targetAxisIndex ก่อน แล้วกําหนดค่าแกนโดยใช้ hAxes ตัวอย่างต่อไปนี้กำหนดชุด 1 ให้กับแกนด้านล่าง และระบุชื่อและสไตล์ข้อความที่กำหนดเอง

series:{1:{targetAxisIndex:1}}, hAxes:{1:{title:'Losses', textStyle:{color: 'red'}}}

พร็อพเพอร์ตี้นี้อาจเป็นออบเจ็กต์หรืออาร์เรย์ก็ได้ โดยออบเจ็กต์คือคอลเล็กชันของออบเจ็กต์ ซึ่งแต่ละรายการจะมีป้ายกำกับตัวเลขที่ระบุแกนที่กำหนด ซึ่งก็คือรูปแบบที่แสดงด้านบน ส่วนอาร์เรย์คืออาร์เรย์ของออบเจ็กต์ 1 รายการต่อแกน ตัวอย่างเช่น รูปแบบอาร์เรย์ต่อไปนี้จะเหมือนกับออบเจ็กต์ hAxis ที่แสดงด้านบน

hAxes: {
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {
      color: 'red'
    }
  } // Axis 1
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ย่อย
ค่าเริ่มต้น: null
hAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบในแนวนอนต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
hAxis.direction

ทิศทางที่ค่าตามแกนแนวนอนเพิ่มขึ้น ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
hAxis.gridlines

ออบเจ็กต์ที่มีพร็อพเพอร์ตี้ในการกําหนดค่าเส้นตารางในแนวนอน โปรดทราบว่าเส้นตารางแกนแนวนอนจะวาดในแนวตั้ง หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.gridlines.color

สีของเส้นตารางแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
hAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
hAxis.logScale

พร็อพเพอร์ตี้ hAxis ที่ทำให้แกนนอนเป็นมาตราส่วนเชิงลําดับเลข (ค่าทั้งหมดต้องเป็นค่าบวก) ตั้งค่าเป็น true สำหรับ "ใช่"

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
hAxis.maxValue

ย้ายค่าสูงสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ด้านขวาในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า x สูงสุดของข้อมูล hAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนนอน ซึ่งคล้ายกับตัวเลือก hAxis.gridlines

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
hAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 ตอนนี้จำนวนเส้นกริดย่อยจะขึ้นอยู่กับช่วงเวลาระหว่างเส้นกริดหลัก (ดู hAxis.gridlines.interval) และพื้นที่ขั้นต่ำที่ต้องการ (ดู hAxis.minorGridlines.minSpacing) ทั้งหมด

ประเภท: number
ค่าเริ่มต้น: 1
hAxis.minValue

ย้ายค่าต่ำสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เลื่อนไปทางซ้ายในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า x ขั้นต่ำของข้อมูล hAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.textPosition

ตำแหน่งของข้อความแกนแนวนอนสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
hAxis.textStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความของแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

hAxis พร็อพเพอร์ตี้ที่ระบุชื่อแกนแนวนอน

ประเภท: string
ค่าเริ่มต้น: null
hAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวนอน

ประเภท: object
ค่าเริ่มต้น: null
hAxis.viewWindow.max

ค่าข้อมูลแนวนอนสูงสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.viewWindow.min

ค่าข้อมูลแนวนอนต่ำสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
isStacked

หากตั้งค่าเป็น true ระบบจะซ้อนองค์ประกอบของทุกชุดค่ายที่ค่าโดเมนแต่ละค่า หมายเหตุ: ในแผนภูมิคอลัมน์ พื้นที่ และ SteppedArea Google Charts จะกลับลําดับของรายการในแผนภูมิเพื่อให้สอดคล้องกับการซ้อนขององค์ประกอบชุดค่างําได้ดีขึ้น (เช่น ชุดที่ 0 จะเป็นรายการในแผนภูมิที่ต่ำที่สุด) กฎนี้ ไม่มีผล กับแผนภูมิแท่ง

ตัวเลือก isStacked ยังรองรับการซ้อน 100% ด้วย โดยระบบจะปรับขนาดกององค์ประกอบที่ค่าโดเมนแต่ละค่าให้รวมกันได้ 100%

ตัวเลือกสำหรับ isStacked มีดังนี้

  • false — องค์ประกอบจะไม่ซ้อนกัน ประเภทการทำงานนี้เป็นค่าเริ่มต้น
  • true — ซ้อนองค์ประกอบของชุดข้อมูลทั้งหมดที่ค่าโดเมนแต่ละค่า
  • 'percent' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 100% โดยค่าขององค์ประกอบแต่ละรายการจะคํานวณเป็นเปอร์เซ็นต์ของ 100%
  • 'relative' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 1 โดยค่าของแต่ละองค์ประกอบจะคํานวณเป็นเศษส่วนของ 1
  • 'absolute' — ทำงานเหมือนกับ isStacked: true

สําหรับการซ้อน 100% ค่าที่คำนวณแล้วของแต่ละองค์ประกอบจะปรากฏในเคล็ดลับเครื่องมือหลังค่าจริง

ค่าเริ่มต้นของแกนเป้าหมายจะเป็นค่าขีดตามสเกล 0-1 แบบสัมพัทธ์เป็นเศษส่วนของ 1 สำหรับ 'relative' และ 0-100% สำหรับ 'percent' (หมายเหตุ: เมื่อใช้ตัวเลือก 'percent' ค่าแกน/ขีดจะแสดงเป็นเปอร์เซ็นต์ แต่ค่าจริงคือค่าสเกล 0-1 แบบสัมพัทธ์ เนื่องจากเครื่องหมายบนแกนเปอร์เซ็นต์เป็นผลมาจากการใช้รูปแบบ "#.##%" กับค่าสเกล 0-1 แบบสัมพัทธ์ เมื่อใช้ isStacked: 'percent' โปรดตรวจสอบว่าได้ระบุเครื่องหมาย/เส้นตารางโดยใช้ค่าสเกลแบบสัมพัทธ์ 0-1) คุณปรับแต่งเส้นตาราง/ค่าการแบ่งแท่งและการจัดรูปแบบได้โดยใช้ตัวเลือก hAxis/vAxis ที่เหมาะสม

การซ้อน 100% รองรับเฉพาะค่าข้อมูลประเภท number เท่านั้น และต้องมีค่าฐานเป็น 0

ประเภท: boolean/string
ค่าเริ่มต้น: false
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legend.position

ตำแหน่งของคำอธิบาย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'bottom' - ใต้แผนภูมิ
  • 'left' - ทางด้านซ้ายของแผนภูมิในกรณีที่แกนด้านซ้ายไม่มีชุดข้อมูลที่เชื่อมโยงอยู่ ดังนั้นหากต้องการให้คำอธิบายทางด้านซ้าย ให้ใช้ตัวเลือก targetAxisIndex: 1
  • 'in' - ภายในแผนภูมิ ตรงมุมซ้ายบน
  • 'none' - ไม่มีการระบุแหล่งที่มา
  • 'right' - ทางด้านขวาของแผนภูมิ ใช้ร่วมกับตัวเลือก vAxes ไม่ได้
  • 'top' - เหนือแผนภูมิ
ประเภท: string
ค่าเริ่มต้น: 'right'
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

หากตั้งค่าเป็น true ระบบจะวาดชุดจากขวาไปซ้าย ค่าเริ่มต้นคือวาดจากซ้ายไปขวา

ตัวเลือกนี้ใช้ได้กับแกน discrete major เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
ซีรีส์

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

  • annotations - ออบเจ็กต์ที่จะใช้กับคำอธิบายประกอบของชุดนี้ ตัวอย่างการใช้เพื่อควบคุม textStyle ของชุดหนังสือมีดังนี้

    series: {
      0: {
        annotations: {
          textStyle: {fontSize: 12, color: 'red' }
        }
      }
    }
              

    ดูตัวเลือก annotations ต่างๆ เพื่อดูรายการที่ปรับแต่งได้ทั้งหมด

  • color - สีที่จะใช้กับชุดข้อมูลนี้ ระบุสตริงสี HTML ที่ถูกต้อง
  • labelInLegend - คําอธิบายชุดที่จะปรากฏในคําอธิบายแผนภูมิ
  • targetAxisIndex - แกนที่จะกำหนดชุดข้อมูลนี้ โดยที่ 0 คือแกนเริ่มต้น และ 1 คือแกนตรงข้าม ค่าเริ่มต้นคือ 0 ให้ตั้งค่าเป็น 1 เพื่อกําหนดแผนภูมิที่แสดงผลอนุกรมต่างๆ บนแกนต่างๆ คุณต้องจัดสรรชุดค่าอย่างน้อย 1 ชุดให้กับแกนเริ่มต้น คุณกําหนดมาตราส่วนที่แตกต่างกันสําหรับแกนต่างๆ ได้
  • visibleInLegend - ค่า boolean โดยที่ true หมายความว่าชุดข้อมูลควรมีรายการคำอธิบายประกอบ และ false หมายความว่าไม่ควรมี ค่าเริ่มต้นคือ true

คุณสามารถระบุอาร์เรย์ของออบเจ็กต์ โดยแต่ละรายการจะมีผลกับชุดหนังสือตามลำดับที่ระบุ หรือจะระบุออบเจ็กต์ที่มีออบเจ็กต์ย่อยแต่ละรายการมีคีย์ตัวเลขที่ระบุชุดหนังสือที่ใช้ก็ได้ ตัวอย่างเช่น การประกาศ 2 รายการต่อไปนี้เหมือนกัน และประกาศชุดที่ 1 เป็นสีดําและไม่มีในคําอธิบายประกอบ และชุดที่ 4 เป็นสีแดงและไม่มีในคําอธิบายประกอบ

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ที่ฝังอยู่
ค่าเริ่มต้น: {}
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ธีม [theme]

ธีมคือชุดค่าตัวเลือกที่กําหนดไว้ล่วงหน้าซึ่งทํางานร่วมกันเพื่อให้ได้ลักษณะการทํางานของแผนภูมิหรือเอฟเฟกต์ภาพที่ต้องการ ปัจจุบันมีธีมเดียวที่ใช้ได้ ดังนี้

  • 'maximized' - ขยายพื้นที่ของแผนภูมิให้ใหญ่ที่สุด และวาดคําอธิบายแผนภูมิและป้ายกำกับทั้งหมดภายในพื้นที่แผนภูมิ
ประเภท: string
ค่าเริ่มต้น: null
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
เส้นแนวโน้ม

แสดงเส้นแนวโน้ม ในแผนภูมิที่รองรับ โดยค่าเริ่มต้น ระบบจะใช้เส้นแนวโน้ม linear แต่คุณปรับแต่งได้ด้วยตัวเลือก trendlines.n.type

เส้นแนวโน้มจะระบุตามอนุกรม ดังนั้นตัวเลือกของคุณจึงมักจะมีลักษณะดังนี้

var options = {
  trendlines: {
    0: {
      type: 'linear',
      color: 'green',
      lineWidth: 3,
      opacity: 0.3,
      visibleInLegend: true
    }
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
trendlines.n.color

สีของ เส้นแนวโน้ม ซึ่งแสดงเป็นชื่อสีภาษาอังกฤษหรือสตริงฐาน 16

ประเภท: string
ค่าเริ่มต้น: สีชุดเริ่มต้น
trendlines.n.degree

สำหรับ เส้นแนวโน้ม ของ type: 'polynomial' ดีกรีของพหุนาม (2 สำหรับแบบ 2 ตัวแปร 3 สำหรับแบบ 3 ตัวแปร และอื่นๆ)

ประเภท: number
ค่าเริ่มต้น: 3
trendlines.n.labelInLegend

หากตั้งค่าไว้ เส้นแนวโน้ม จะปรากฏในคำอธิบายเป็นสตริงนี้

ประเภท: string
ค่าเริ่มต้น: null
trendlines.n.lineWidth

ความกว้างของเส้น เส้นแนวโน้มเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: 2
trendlines.n.type

เส้นแนวโน้ม เป็น 'linear' (ค่าเริ่มต้น), 'exponential' หรือ 'polynomial'

ประเภท: string
ค่าเริ่มต้น: linear
trendlines.n.visibleInLegend

สมการของเส้นแนวโน้มจะปรากฏในคำอธิบายหรือไม่ ซึ่งจะปรากฏในเคล็ดลับเครื่องมือของเส้นแนวโน้ม

ประเภท: boolean
ค่าเริ่มต้น: false
useFirstColumnAsDomain

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์เป็นโดเมน

ประเภท: boolean
vAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบแกนแนวตั้งต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
ประเภท: object
ค่าเริ่มต้น: null
vAxis.direction

ทิศทางที่ค่าตามแกนแนวตั้งเพิ่มขึ้น โดยค่าเริ่มต้น ค่าต่ำจะอยู่ที่ด้านล่างของแผนภูมิ ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
vAxis.gridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นตารางในแนวตั้ง โปรดทราบว่าเส้นตารางแกนแนวตั้งจะวาดในแนวนอน หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
vAxis.gridlines.color

สีของเส้นตารางแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
vAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
vAxis.logScale

หากเป็น true จะทำให้แกนแนวตั้งเป็นมาตราส่วนเชิงลอนจิทูด หมายเหตุ: ค่าทั้งหมดต้องเป็นค่าบวก

ประเภท: boolean
ค่าเริ่มต้น: false
vAxis.maxValue

ย้ายค่าสูงสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เพิ่มขึ้นในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า y สูงสุดของข้อมูล vAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนแนวตั้ง ซึ่งคล้ายกับตัวเลือก vAxis.gridlines

ประเภท: object
ค่าเริ่มต้น: null
vAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
vAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 จำนวนเส้นกริดย่อยจะขึ้นอยู่กับระยะห่างระหว่างเส้นกริดหลักและพื้นที่ขั้นต่ำที่ต้องการ

ประเภท: number
ค่าเริ่มต้น: 1
vAxis.minValue

ย้ายค่าต่ำสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ลดลงในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า y ขั้นต่ำของข้อมูล vAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: null
vAxis.textPosition

ตำแหน่งของข้อความแกนแนวตั้งสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
vAxis.textStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความของแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

ระบุชื่อแกนแนวตั้ง

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
vAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวตั้ง

ประเภท: object
ค่าเริ่มต้น: null
vAxis.viewWindow.max

ค่าข้อมูลแนวตั้งสูงสุดที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.viewWindow.min

ค่าข้อมูลแนวตั้งขั้นต่ำที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ

ตัวเลือกการกําหนดค่าแผนภูมิฟองอากาศ

ชื่อ
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของส่วนที่เป็นพื้นในแผนภูมิในรูปแบบสตริงสี HTML

ประเภท: string
ค่าเริ่มต้น: 'white'
ลูกโป่ง

ออบเจ็กต์ที่มีสมาชิกเพื่อกำหนดค่าพร็อพเพอร์ตี้ภาพของลูกโป่ง

ประเภท: object
ค่าเริ่มต้น: null
bubble.opacity

ความทึบแสงของฟอง โดยที่ 0 คือโปร่งแสงทั้งหมด และ 1 คือทึบแสงทั้งหมด

ประเภท: ตัวเลขระหว่าง 0.0 ถึง 1.0
ค่าเริ่มต้น: 0.8
bubble.stroke

สีของเส้นโครงร่างของฟอง

ประเภท: string
ค่าเริ่มต้น: '#ccc'
bubble.textStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความแบบฟองอากาศ ออบเจ็กต์มีรูปแบบดังนี้

{color: <string>, fontName: <string>, fontSize: <number>}

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
chartArea

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าตําแหน่งและขนาดของพื้นที่แผนภูมิ (ที่วาดแผนภูมิเอง ยกเว้นแกนนอนและลําดับชั้น) ระบบรองรับ 2 รูปแบบ ได้แก่ ตัวเลขหรือตัวเลขตามด้วย % ตัวเลขธรรมดาคือค่าในพิกเซล ส่วนตัวเลขตามด้วย % คือเปอร์เซ็นต์ ตัวอย่าง: chartArea:{left:20,top:0,width:'50%',height:'75%'}

ประเภท: object
ค่าเริ่มต้น: null
chartArea.backgroundColor
สีพื้นหลังของพื้นที่แผนภูมิ เมื่อใช้สตริง สตริงดังกล่าวอาจเป็นสตริงฐาน 16 (เช่น '#fdc') หรือชื่อสีภาษาอังกฤษ เมื่อใช้ออบเจ็กต์ คุณสามารถระบุพร็อพเพอร์ตี้ต่อไปนี้ได้
  • stroke: สีที่ระบุเป็นสตริงฐาน 16 หรือชื่อสีภาษาอังกฤษ
  • strokeWidth: หากระบุไว้ ให้วาดเส้นขอบรอบๆ พื้นที่แผนภูมิที่มีความกว้างที่ระบุ (และด้วยสีของ stroke)
ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
chartArea.height

ความสูงของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.left

ระยะห่างระหว่างเส้นขอบด้านซ้ายกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.top

ระยะห่างระหว่างเส้นขอบด้านบนกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.width

ความกว้างของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
hAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบในแนวนอนต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
hAxis.direction

ทิศทางที่ค่าตามแกนแนวนอนเพิ่มขึ้น ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
hAxis.gridlines

ออบเจ็กต์ที่มีพร็อพเพอร์ตี้ในการกําหนดค่าเส้นตารางในแนวนอน โปรดทราบว่าเส้นตารางแกนแนวนอนจะวาดในแนวตั้ง หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.gridlines.color

สีของเส้นตารางแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
hAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
hAxis.logScale

พร็อพเพอร์ตี้ hAxis ที่ทำให้แกนนอนเป็นมาตราส่วนเชิงลําดับเลข (ค่าทั้งหมดต้องเป็นค่าบวก) ตั้งค่าเป็น true สำหรับ "ใช่"

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
hAxis.maxValue

ย้ายค่าสูงสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ด้านขวาในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า x สูงสุดของข้อมูล hAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนนอน ซึ่งคล้ายกับตัวเลือก hAxis.gridlines

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
hAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 ตอนนี้จำนวนเส้นกริดย่อยจะขึ้นอยู่กับช่วงเวลาระหว่างเส้นกริดหลัก (ดู hAxis.gridlines.interval) และพื้นที่ขั้นต่ำที่ต้องการ (ดู hAxis.minorGridlines.minSpacing) ทั้งหมด

ประเภท: number
ค่าเริ่มต้น: 1
hAxis.minValue

ย้ายค่าต่ำสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เลื่อนไปทางซ้ายในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า x ขั้นต่ำของข้อมูล hAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.textPosition

ตำแหน่งของข้อความแกนแนวนอนสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
hAxis.textStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความของแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

hAxis พร็อพเพอร์ตี้ที่ระบุชื่อแกนแนวนอน

ประเภท: string
ค่าเริ่มต้น: null
hAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวนอน

ประเภท: object
ค่าเริ่มต้น: null
hAxis.viewWindow.max

ค่าข้อมูลแนวนอนสูงสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.viewWindow.min

ค่าข้อมูลแนวนอนต่ำสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legend.position

ตำแหน่งของคำอธิบาย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'bottom' - ใต้แผนภูมิ
  • 'left' - ทางด้านซ้ายของแผนภูมิในกรณีที่แกนด้านซ้ายไม่มีชุดข้อมูลที่เชื่อมโยงอยู่ ดังนั้นหากต้องการให้คำอธิบายทางด้านซ้าย ให้ใช้ตัวเลือก targetAxisIndex: 1
  • 'in' - ภายในแผนภูมิ ตรงมุมซ้ายบน
  • 'none' - ไม่มีการระบุแหล่งที่มา
  • 'right' - ทางด้านขวาของแผนภูมิ ใช้ร่วมกับตัวเลือก vAxes ไม่ได้
  • 'top' - เหนือแผนภูมิ
ประเภท: string
ค่าเริ่มต้น: 'right'
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ซีรีส์

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

  • color - สีที่จะใช้กับชุดข้อมูลนี้ ระบุสตริงสี HTML ที่ถูกต้อง
  • visibleInLegend - ค่า boolean โดยที่ true หมายความว่าชุดข้อมูลควรมีรายการคำอธิบายประกอบ และ false หมายความว่าไม่ควรมี ค่าเริ่มต้นคือ true
ตัวอย่าง
series: {'Europe': {color: 'green'}}
ประเภท: ออบเจ็กต์ที่มีออบเจ็กต์ที่ฝังอยู่
ค่าเริ่มต้น: {}
sizeAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าการเชื่อมโยงค่ากับขนาดของฟอง หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

 {minValue: 0,  maxSize: 20}
ประเภท: object
ค่าเริ่มต้น: null
sizeAxis.maxSize

รัศมีสูงสุดของฟองอากาศที่ใหญ่ที่สุดที่เป็นไปได้ในหน่วยพิกเซล

ประเภท: number
ค่าเริ่มต้น: 30
sizeAxis.minSize

รัศมีขั้นต่ำของฟองอากาศที่เล็กที่สุดที่เป็นไปได้ในหน่วยพิกเซล

ประเภท: number
ค่าเริ่มต้น: 5
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ธีม [theme]

ธีมคือชุดค่าตัวเลือกที่กําหนดไว้ล่วงหน้าซึ่งทํางานร่วมกันเพื่อให้ได้ลักษณะการทํางานของแผนภูมิหรือเอฟเฟกต์ภาพที่ต้องการ ปัจจุบันมีธีมเดียวที่ใช้ได้ ดังนี้

  • 'maximized' - ขยายพื้นที่ของแผนภูมิให้ใหญ่ที่สุด และวาดคําอธิบายแผนภูมิและป้ายกำกับทั้งหมดภายในพื้นที่แผนภูมิ
ประเภท: string
ค่าเริ่มต้น: null
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
treatLabelsAsText

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์นั้นเป็นคอลัมน์ข้อความ

ประเภท: boolean
useFirstColumnAsDomain

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์เป็นโดเมน

ประเภท: boolean
vAxes

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

หากต้องการระบุแผนภูมิที่มีแกนแนวตั้งหลายแกน ให้กําหนดแกนใหม่โดยใช้ series.targetAxisIndex ก่อน แล้วกําหนดค่าแกนโดยใช้ vAxes ตัวอย่างต่อไปนี้กำหนดชุดที่ 2 ให้กับแกนขวา และระบุชื่อและสไตล์ข้อความที่กำหนดเอง

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

พร็อพเพอร์ตี้นี้อาจเป็นออบเจ็กต์หรืออาร์เรย์ก็ได้ โดยออบเจ็กต์คือคอลเล็กชันของออบเจ็กต์ ซึ่งแต่ละรายการจะมีป้ายกำกับตัวเลขที่ระบุแกนที่กำหนด ซึ่งก็คือรูปแบบที่แสดงด้านบน ส่วนอาร์เรย์คืออาร์เรย์ของออบเจ็กต์ 1 รายการต่อแกน ตัวอย่างเช่น รูปแบบอาร์เรย์ต่อไปนี้จะเหมือนกับออบเจ็กต์ vAxis ที่แสดงด้านบน

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ย่อย
ค่าเริ่มต้น: null
vAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบแกนแนวตั้งต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
ประเภท: object
ค่าเริ่มต้น: null
vAxis.direction

ทิศทางที่ค่าตามแกนแนวตั้งเพิ่มขึ้น โดยค่าเริ่มต้น ค่าต่ำจะอยู่ที่ด้านล่างของแผนภูมิ ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
vAxis.gridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นตารางในแนวตั้ง โปรดทราบว่าเส้นตารางแกนแนวตั้งจะวาดในแนวนอน หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
vAxis.gridlines.color

สีของเส้นตารางแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
vAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
vAxis.logScale

หากเป็น true จะทำให้แกนแนวตั้งเป็นมาตราส่วนเชิงลอนจิทูด หมายเหตุ: ค่าทั้งหมดต้องเป็นค่าบวก

ประเภท: boolean
ค่าเริ่มต้น: false
vAxis.maxValue

ย้ายค่าสูงสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เพิ่มขึ้นในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า y สูงสุดของข้อมูล vAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนแนวตั้ง ซึ่งคล้ายกับตัวเลือก vAxis.gridlines

ประเภท: object
ค่าเริ่มต้น: null
vAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
vAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 จำนวนเส้นกริดย่อยจะขึ้นอยู่กับระยะห่างระหว่างเส้นกริดหลักและพื้นที่ขั้นต่ำที่ต้องการ

ประเภท: number
ค่าเริ่มต้น: 1
vAxis.minValue

ย้ายค่าต่ำสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ลดลงในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า y ขั้นต่ำของข้อมูล vAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: null
vAxis.textPosition

ตำแหน่งของข้อความแกนแนวตั้งสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
vAxis.textStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความของแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

ระบุชื่อแกนแนวตั้ง

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
vAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวตั้ง

ประเภท: object
ค่าเริ่มต้น: null
vAxis.viewWindow.max

ค่าข้อมูลแนวตั้งสูงสุดที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.viewWindow.min

ค่าข้อมูลแนวตั้งขั้นต่ำที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ

ตัวเลือกการกำหนดค่าปฏิทิน

ชื่อ
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
ความกว้าง

ความกว้างของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความกว้างขององค์ประกอบที่บรรจุ

ตัวเลือกการกําหนดค่าแผนภูมิแท่งเทียน

ชื่อ
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของส่วนที่เป็นพื้นในแผนภูมิในรูปแบบสตริงสี HTML

ประเภท: string
ค่าเริ่มต้น: 'white'
chartArea

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าตําแหน่งและขนาดของพื้นที่แผนภูมิ (ที่วาดแผนภูมิเอง ยกเว้นแกนนอนและลําดับชั้น) ระบบรองรับ 2 รูปแบบ ได้แก่ ตัวเลขหรือตัวเลขตามด้วย % ตัวเลขธรรมดาคือค่าในพิกเซล ส่วนตัวเลขตามด้วย % คือเปอร์เซ็นต์ ตัวอย่าง: chartArea:{left:20,top:0,width:'50%',height:'75%'}

ประเภท: object
ค่าเริ่มต้น: null
chartArea.backgroundColor
สีพื้นหลังของพื้นที่แผนภูมิ เมื่อใช้สตริง สตริงดังกล่าวอาจเป็นสตริงฐาน 16 (เช่น '#fdc') หรือชื่อสีภาษาอังกฤษ เมื่อใช้ออบเจ็กต์ คุณสามารถระบุพร็อพเพอร์ตี้ต่อไปนี้ได้
  • stroke: สีที่ระบุเป็นสตริงฐาน 16 หรือชื่อสีภาษาอังกฤษ
  • strokeWidth: หากระบุไว้ ให้วาดเส้นขอบรอบๆ พื้นที่แผนภูมิที่มีความกว้างที่ระบุ (และด้วยสีของ stroke)
ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
chartArea.height

ความสูงของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.left

ระยะห่างระหว่างเส้นขอบด้านซ้ายกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.top

ระยะห่างระหว่างเส้นขอบด้านบนกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.width

ความกว้างของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
hAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบในแนวนอนต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
hAxis.direction

ทิศทางที่ค่าตามแกนแนวนอนเพิ่มขึ้น ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
hAxis.gridlines

ออบเจ็กต์ที่มีพร็อพเพอร์ตี้ในการกําหนดค่าเส้นตารางในแนวนอน โปรดทราบว่าเส้นตารางแกนแนวนอนจะวาดในแนวตั้ง หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.gridlines.color

สีของเส้นตารางแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
hAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
hAxis.logScale

พร็อพเพอร์ตี้ hAxis ที่ทำให้แกนนอนเป็นมาตราส่วนเชิงลําดับเลข (ค่าทั้งหมดต้องเป็นค่าบวก) ตั้งค่าเป็น true สำหรับ "ใช่"

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
hAxis.maxValue

ย้ายค่าสูงสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ด้านขวาในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า x สูงสุดของข้อมูล hAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนนอน ซึ่งคล้ายกับตัวเลือก hAxis.gridlines

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
hAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 ตอนนี้จำนวนเส้นกริดย่อยจะขึ้นอยู่กับช่วงเวลาระหว่างเส้นกริดหลัก (ดู hAxis.gridlines.interval) และพื้นที่ขั้นต่ำที่ต้องการ (ดู hAxis.minorGridlines.minSpacing) ทั้งหมด

ประเภท: number
ค่าเริ่มต้น: 1
hAxis.minValue

ย้ายค่าต่ำสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เลื่อนไปทางซ้ายในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า x ขั้นต่ำของข้อมูล hAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.textPosition

ตำแหน่งของข้อความแกนแนวนอนสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
hAxis.textStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความของแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

hAxis พร็อพเพอร์ตี้ที่ระบุชื่อแกนแนวนอน

ประเภท: string
ค่าเริ่มต้น: null
hAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวนอน

ประเภท: object
ค่าเริ่มต้น: null
hAxis.viewWindow.max

ค่าข้อมูลแนวนอนสูงสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.viewWindow.min

ค่าข้อมูลแนวนอนต่ำสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legend.position

ตำแหน่งของคำอธิบาย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'bottom' - ใต้แผนภูมิ
  • 'left' - ทางด้านซ้ายของแผนภูมิในกรณีที่แกนด้านซ้ายไม่มีชุดข้อมูลที่เชื่อมโยงอยู่ ดังนั้นหากต้องการให้คำอธิบายทางด้านซ้าย ให้ใช้ตัวเลือก targetAxisIndex: 1
  • 'in' - ภายในแผนภูมิ ตรงมุมซ้ายบน
  • 'none' - ไม่มีการระบุแหล่งที่มา
  • 'right' - ทางด้านขวาของแผนภูมิ ใช้ร่วมกับตัวเลือก vAxes ไม่ได้
  • 'top' - เหนือแผนภูมิ
ประเภท: string
ค่าเริ่มต้น: 'right'
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

หากตั้งค่าเป็น true ระบบจะวาดชุดจากขวาไปซ้าย ค่าเริ่มต้นคือวาดจากซ้ายไปขวา

ตัวเลือกนี้ใช้ได้กับแกน discrete major เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
ซีรีส์

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

  • color - สีที่จะใช้กับชุดข้อมูลนี้ ระบุสตริงสี HTML ที่ถูกต้อง
  • fallingColor.fill - ลบล้างค่า candlestick.fallingColor.fill ระดับทั่วทั้งระบบสำหรับชุดนี้
  • fallingColor.stroke - ลบล้างค่า candlestick.fallingColor.stroke ระดับทั่วทั้งระบบสำหรับชุดนี้
  • fallingColor.strokeWidth - ลบล้างค่า candlestick.fallingColor.strokeWidth ระดับทั่วทั้งระบบสำหรับชุดนี้
  • labelInLegend - คําอธิบายชุดที่จะปรากฏในคําอธิบายแผนภูมิ
  • risingColor.fill - ลบล้างค่า candlestick.risingColor.fill ระดับทั่วทั้งระบบสำหรับชุดนี้
  • risingColor.stroke - ลบล้างค่า candlestick.risingColor.stroke ระดับทั่วทั้งระบบสำหรับชุดนี้
  • risingColor.strokeWidth - ลบล้างค่า candlestick.risingColor.strokeWidth ระดับทั่วทั้งระบบสำหรับชุดนี้
  • targetAxisIndex - แกนที่จะกำหนดชุดข้อมูลนี้ โดยที่ 0 คือแกนเริ่มต้น และ 1 คือแกนตรงข้าม ค่าเริ่มต้นคือ 0 ให้ตั้งค่าเป็น 1 เพื่อกําหนดแผนภูมิที่แสดงผลอนุกรมต่างๆ บนแกนต่างๆ คุณต้องจัดสรรชุดค่าอย่างน้อย 1 ชุดให้กับแกนเริ่มต้น คุณกําหนดมาตราส่วนที่แตกต่างกันสําหรับแกนต่างๆ ได้
  • visibleInLegend - ค่า boolean โดยที่ true หมายความว่าชุดข้อมูลควรมีรายการคำอธิบายประกอบ และ false หมายความว่าไม่ควรมี ค่าเริ่มต้นคือ true

คุณสามารถระบุอาร์เรย์ของออบเจ็กต์ โดยแต่ละรายการจะมีผลกับชุดหนังสือตามลำดับที่ระบุ หรือจะระบุออบเจ็กต์ที่มีออบเจ็กต์ย่อยแต่ละรายการมีคีย์ตัวเลขที่ระบุชุดหนังสือที่ใช้ก็ได้ ตัวอย่างเช่น การประกาศ 2 รายการต่อไปนี้เหมือนกัน และประกาศชุดที่ 1 เป็นสีดําและไม่มีในคําอธิบายประกอบ และชุดที่ 4 เป็นสีแดงและไม่มีในคําอธิบายประกอบ

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ที่ฝังอยู่
ค่าเริ่มต้น: {}
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ธีม [theme]

ธีมคือชุดค่าตัวเลือกที่กําหนดไว้ล่วงหน้าซึ่งทํางานร่วมกันเพื่อให้ได้ลักษณะการทํางานของแผนภูมิหรือเอฟเฟกต์ภาพที่ต้องการ ปัจจุบันมีธีมเดียวที่ใช้ได้ ดังนี้

  • 'maximized' - ขยายพื้นที่ของแผนภูมิให้ใหญ่ที่สุด และวาดคําอธิบายแผนภูมิและป้ายกำกับทั้งหมดภายในพื้นที่แผนภูมิ
ประเภท: string
ค่าเริ่มต้น: null
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
useFirstColumnAsDomain

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์เป็นโดเมน

ประเภท: boolean
vAxes

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

หากต้องการระบุแผนภูมิที่มีแกนแนวตั้งหลายแกน ให้กําหนดแกนใหม่โดยใช้ series.targetAxisIndex ก่อน แล้วกําหนดค่าแกนโดยใช้ vAxes ตัวอย่างต่อไปนี้กำหนดชุดที่ 2 ให้กับแกนขวา และระบุชื่อและสไตล์ข้อความที่กำหนดเอง

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

พร็อพเพอร์ตี้นี้อาจเป็นออบเจ็กต์หรืออาร์เรย์ก็ได้ โดยออบเจ็กต์คือคอลเล็กชันของออบเจ็กต์ ซึ่งแต่ละรายการจะมีป้ายกำกับตัวเลขที่ระบุแกนที่กำหนด ซึ่งก็คือรูปแบบที่แสดงด้านบน ส่วนอาร์เรย์คืออาร์เรย์ของออบเจ็กต์ 1 รายการต่อแกน ตัวอย่างเช่น รูปแบบอาร์เรย์ต่อไปนี้จะเหมือนกับออบเจ็กต์ vAxis ที่แสดงด้านบน

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ย่อย
ค่าเริ่มต้น: null
vAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบแกนแนวตั้งต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
ประเภท: object
ค่าเริ่มต้น: null
vAxis.direction

ทิศทางที่ค่าตามแกนแนวตั้งเพิ่มขึ้น โดยค่าเริ่มต้น ค่าต่ำจะอยู่ที่ด้านล่างของแผนภูมิ ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
vAxis.gridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นตารางในแนวตั้ง โปรดทราบว่าเส้นตารางแกนแนวตั้งจะวาดในแนวนอน หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
vAxis.gridlines.color

สีของเส้นตารางแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
vAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
vAxis.logScale

หากเป็น true จะทำให้แกนแนวตั้งเป็นมาตราส่วนเชิงลอนจิทูด หมายเหตุ: ค่าทั้งหมดต้องเป็นค่าบวก

ประเภท: boolean
ค่าเริ่มต้น: false
vAxis.maxValue

ย้ายค่าสูงสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เพิ่มขึ้นในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า y สูงสุดของข้อมูล vAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนแนวตั้ง ซึ่งคล้ายกับตัวเลือก vAxis.gridlines

ประเภท: object
ค่าเริ่มต้น: null
vAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
vAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 จำนวนเส้นกริดย่อยจะขึ้นอยู่กับระยะห่างระหว่างเส้นกริดหลักและพื้นที่ขั้นต่ำที่ต้องการ

ประเภท: number
ค่าเริ่มต้น: 1
vAxis.minValue

ย้ายค่าต่ำสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ลดลงในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า y ขั้นต่ำของข้อมูล vAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: null
vAxis.textPosition

ตำแหน่งของข้อความแกนแนวตั้งสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
vAxis.textStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความของแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

ระบุชื่อแกนแนวตั้ง

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
vAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวตั้ง

ประเภท: object
ค่าเริ่มต้น: null
vAxis.viewWindow.max

ค่าข้อมูลแนวตั้งสูงสุดที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.viewWindow.min

ค่าข้อมูลแนวตั้งขั้นต่ำที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ

ตัวเลือกการกําหนดค่าแผนภูมิคอลัมน์

ชื่อ
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของส่วนที่เป็นพื้นในแผนภูมิในรูปแบบสตริงสี HTML

ประเภท: string
ค่าเริ่มต้น: 'white'
chartArea

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าตําแหน่งและขนาดของพื้นที่แผนภูมิ (ที่วาดแผนภูมิเอง ยกเว้นแกนนอนและลําดับชั้น) ระบบรองรับ 2 รูปแบบ ได้แก่ ตัวเลขหรือตัวเลขตามด้วย % ตัวเลขธรรมดาคือค่าในพิกเซล ส่วนตัวเลขตามด้วย % คือเปอร์เซ็นต์ ตัวอย่าง: chartArea:{left:20,top:0,width:'50%',height:'75%'}

ประเภท: object
ค่าเริ่มต้น: null
chartArea.backgroundColor
สีพื้นหลังของพื้นที่แผนภูมิ เมื่อใช้สตริง สตริงดังกล่าวอาจเป็นสตริงฐาน 16 (เช่น '#fdc') หรือชื่อสีภาษาอังกฤษ เมื่อใช้ออบเจ็กต์ คุณสามารถระบุพร็อพเพอร์ตี้ต่อไปนี้ได้
  • stroke: สีที่ระบุเป็นสตริงฐาน 16 หรือชื่อสีภาษาอังกฤษ
  • strokeWidth: หากระบุไว้ ให้วาดเส้นขอบรอบๆ พื้นที่แผนภูมิที่มีความกว้างที่ระบุ (และด้วยสีของ stroke)
ประเภท: stringหรือ object
ค่าเริ่มต้น: 'white'
chartArea.height

ความสูงของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.left

ระยะห่างระหว่างเส้นขอบด้านซ้ายกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.top

ระยะห่างระหว่างเส้นขอบด้านบนกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.width

ความกว้างของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
hAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบในแนวนอนต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
hAxis.direction

ทิศทางที่ค่าตามแกนแนวนอนเพิ่มขึ้น ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
hAxis.gridlines

ออบเจ็กต์ที่มีพร็อพเพอร์ตี้ในการกําหนดค่าเส้นตารางในแนวนอน โปรดทราบว่าเส้นตารางแกนแนวนอนจะวาดในแนวตั้ง หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.gridlines.color

สีของเส้นตารางแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
hAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
hAxis.logScale

พร็อพเพอร์ตี้ hAxis ที่ทำให้แกนนอนเป็นมาตราส่วนเชิงลําดับเลข (ค่าทั้งหมดต้องเป็นค่าบวก) ตั้งค่าเป็น true สำหรับ "ใช่"

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
hAxis.maxValue

ย้ายค่าสูงสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ด้านขวาในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า x สูงสุดของข้อมูล hAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนนอน ซึ่งคล้ายกับตัวเลือก hAxis.gridlines

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
hAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 ตอนนี้จำนวนเส้นกริดย่อยจะขึ้นอยู่กับช่วงเวลาระหว่างเส้นกริดหลัก (ดู hAxis.gridlines.interval) และพื้นที่ขั้นต่ำที่ต้องการ (ดู hAxis.minorGridlines.minSpacing) ทั้งหมด

ประเภท: number
ค่าเริ่มต้น: 1
hAxis.minValue

ย้ายค่าต่ำสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เลื่อนไปทางซ้ายในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า x ขั้นต่ำของข้อมูล hAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.textPosition

ตำแหน่งของข้อความแกนแนวนอนสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
hAxis.textStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความของแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

hAxis พร็อพเพอร์ตี้ที่ระบุชื่อแกนแนวนอน

ประเภท: string
ค่าเริ่มต้น: null
hAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวนอน

ประเภท: object
ค่าเริ่มต้น: null
hAxis.viewWindow.max

ค่าข้อมูลแนวนอนสูงสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.viewWindow.min

ค่าข้อมูลแนวนอนต่ำสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
isStacked

หากตั้งค่าเป็น true ระบบจะซ้อนองค์ประกอบของทุกชุดค่ายที่ค่าโดเมนแต่ละค่า หมายเหตุ: ในแผนภูมิคอลัมน์ พื้นที่ และ SteppedArea Google Charts จะกลับลําดับของรายการในแผนภูมิเพื่อให้สอดคล้องกับการซ้อนขององค์ประกอบชุดค่างําได้ดีขึ้น (เช่น ชุดที่ 0 จะเป็นรายการในแผนภูมิที่ต่ำที่สุด) กฎนี้ ไม่มีผล กับแผนภูมิแท่ง

ตัวเลือก isStacked ยังรองรับการซ้อน 100% ด้วย โดยระบบจะปรับขนาดกององค์ประกอบที่ค่าโดเมนแต่ละค่าใหม่เพื่อให้รวมกันได้ 100%

ตัวเลือกสำหรับ isStacked มีดังนี้

  • false — องค์ประกอบจะไม่ซ้อนกัน ประเภทการทำงานนี้เป็นค่าเริ่มต้น
  • true — ซ้อนองค์ประกอบของชุดข้อมูลทั้งหมดที่ค่าโดเมนแต่ละค่า
  • 'percent' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 100% โดยค่าขององค์ประกอบแต่ละรายการจะคํานวณเป็นเปอร์เซ็นต์ของ 100%
  • 'relative' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 1 โดยค่าของแต่ละองค์ประกอบจะคํานวณเป็นเศษส่วนของ 1
  • 'absolute' — ทำงานเหมือนกับ isStacked: true

สําหรับการซ้อน 100% ค่าที่คำนวณแล้วของแต่ละองค์ประกอบจะปรากฏในเคล็ดลับเครื่องมือหลังค่าจริง

ค่าเริ่มต้นของแกนเป้าหมายจะเป็นค่าขีดตามสเกล 0-1 แบบสัมพัทธ์เป็นเศษส่วนของ 1 สำหรับ 'relative' และ 0-100% สำหรับ 'percent' (หมายเหตุ: เมื่อใช้ตัวเลือก 'percent' ค่าแกน/ขีดจะแสดงเป็นเปอร์เซ็นต์ แต่ค่าจริงคือค่าสเกล 0-1 แบบสัมพัทธ์ เนื่องจากเครื่องหมายบนแกนเปอร์เซ็นต์เป็นผลมาจากการใช้รูปแบบ "#.##%" กับค่าสเกล 0-1 แบบสัมพัทธ์ เมื่อใช้ isStacked: 'percent' โปรดตรวจสอบว่าได้ระบุเครื่องหมาย/เส้นตารางโดยใช้ค่าสเกลแบบสัมพัทธ์ 0-1) คุณปรับแต่งเส้นตาราง/ค่าการแบ่งแท่งและการจัดรูปแบบได้โดยใช้ตัวเลือก hAxis/vAxis ที่เหมาะสม

การซ้อน 100% รองรับเฉพาะค่าข้อมูลประเภท number เท่านั้น และต้องมีค่าฐานเป็น 0

ประเภท: boolean/string
ค่าเริ่มต้น: false
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legend.position

ตำแหน่งของคำอธิบาย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'bottom' - ใต้แผนภูมิ
  • 'left' - ทางด้านซ้ายของแผนภูมิในกรณีที่แกนด้านซ้ายไม่มีชุดข้อมูลที่เชื่อมโยงอยู่ ดังนั้นหากต้องการให้คำอธิบายทางด้านซ้าย ให้ใช้ตัวเลือก targetAxisIndex: 1
  • 'in' - ภายในแผนภูมิ ตรงมุมซ้ายบน
  • 'none' - ไม่มีการระบุแหล่งที่มา
  • 'right' - ทางด้านขวาของแผนภูมิ ใช้ร่วมกับตัวเลือก vAxes ไม่ได้
  • 'top' - เหนือแผนภูมิ
ประเภท: string
ค่าเริ่มต้น: 'right'
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

หากตั้งค่าเป็น true ระบบจะวาดชุดจากขวาไปซ้าย ค่าเริ่มต้นคือวาดจากซ้ายไปขวา

ตัวเลือกนี้ใช้ได้กับแกน discrete major เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
ซีรีส์

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

  • annotations - ออบเจ็กต์ที่จะใช้กับคำอธิบายประกอบของชุดนี้ ตัวอย่างการใช้เพื่อควบคุม textStyle ของชุดหนังสือมีดังนี้

    series: {
      0: {
        annotations: {
          textStyle: {fontSize: 12, color: 'red' }
        }
      }
    }
              

    ดูตัวเลือก annotations ต่างๆ เพื่อดูรายการที่ปรับแต่งได้ทั้งหมด

  • color - สีที่จะใช้กับชุดข้อมูลนี้ ระบุสตริงสี HTML ที่ถูกต้อง
  • labelInLegend - คําอธิบายชุดที่จะปรากฏในคําอธิบายแผนภูมิ
  • targetAxisIndex - แกนที่จะกำหนดชุดข้อมูลนี้ โดยที่ 0 คือแกนเริ่มต้น และ 1 คือแกนตรงข้าม ค่าเริ่มต้นคือ 0 ให้ตั้งค่าเป็น 1 เพื่อกําหนดแผนภูมิที่แสดงผลอนุกรมต่างๆ บนแกนต่างๆ คุณต้องจัดสรรชุดค่าอย่างน้อย 1 ชุดให้กับแกนเริ่มต้น คุณกําหนดมาตราส่วนที่แตกต่างกันสําหรับแกนต่างๆ ได้

คุณสามารถระบุอาร์เรย์ของออบเจ็กต์ โดยแต่ละรายการมีผลกับชุดหนังสือตามลำดับที่ระบุ หรือจะระบุออบเจ็กต์ที่มีออบเจ็กต์ย่อยแต่ละรายการมีคีย์ตัวเลขที่ระบุชุดหนังสือที่ใช้ก็ได้ ตัวอย่างเช่น การประกาศ 2 รายการต่อไปนี้เหมือนกัน และประกาศชุดที่ 1 เป็นสีดําและไม่มีในคําอธิบายประกอบ และชุดที่ 4 เป็นสีแดงและไม่มีในคําอธิบายประกอบ

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ที่ฝังอยู่
ค่าเริ่มต้น: {}
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ธีม [theme]

ธีมคือชุดค่าตัวเลือกที่กําหนดไว้ล่วงหน้าซึ่งทํางานร่วมกันเพื่อให้ได้ลักษณะการทํางานของแผนภูมิหรือเอฟเฟกต์ภาพที่ต้องการ ปัจจุบันมีธีมเดียวที่ใช้ได้ ดังนี้

  • 'maximized' - ขยายพื้นที่ของแผนภูมิให้ใหญ่ที่สุด และวาดคําอธิบายแผนภูมิและป้ายกำกับทั้งหมดภายในพื้นที่แผนภูมิ
ประเภท: string
ค่าเริ่มต้น: null
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
เส้นแนวโน้ม

แสดงเส้นแนวโน้ม ในแผนภูมิที่รองรับ โดยค่าเริ่มต้น ระบบจะใช้เส้นแนวโน้ม linear แต่คุณปรับแต่งได้ด้วยตัวเลือก trendlines.n.type

เส้นแนวโน้มจะระบุตามอนุกรม ดังนั้นตัวเลือกของคุณจึงมักจะมีลักษณะดังนี้

var options = {
  trendlines: {
    0: {
      type: 'linear',
      color: 'green',
      lineWidth: 3,
      opacity: 0.3,
      visibleInLegend: true
    }
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
trendlines.n.color

สีของ เส้นแนวโน้ม ซึ่งแสดงเป็นชื่อสีภาษาอังกฤษหรือสตริงฐาน 16

ประเภท: string
ค่าเริ่มต้น: สีชุดเริ่มต้น
trendlines.n.degree

สำหรับ เส้นแนวโน้ม ของ type: 'polynomial' ดีกรีของพหุนาม (2 สำหรับแบบ 2 ตัวแปร 3 สำหรับแบบ 3 ตัวแปร และอื่นๆ)

ประเภท: number
ค่าเริ่มต้น: 3
trendlines.n.labelInLegend

หากตั้งค่าไว้ เส้นแนวโน้ม จะปรากฏในคำอธิบายเป็นสตริงนี้

ประเภท: string
ค่าเริ่มต้น: null
trendlines.n.lineWidth

ความกว้างของเส้น เส้นแนวโน้มเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: 2
trendlines.n.type

เส้นแนวโน้ม เป็น 'linear' (ค่าเริ่มต้น), 'exponential' หรือ 'polynomial'

ประเภท: string
ค่าเริ่มต้น: linear
trendlines.n.visibleInLegend

สมการของเส้นแนวโน้มจะปรากฏในคำอธิบายหรือไม่ ซึ่งจะปรากฏในเคล็ดลับเครื่องมือของเส้นแนวโน้ม

ประเภท: boolean
ค่าเริ่มต้น: false
useFirstColumnAsDomain

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์เป็นโดเมน

ประเภท: boolean
vAxes

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

หากต้องการระบุแผนภูมิที่มีแกนแนวตั้งหลายแกน ให้กําหนดแกนใหม่โดยใช้ series.targetAxisIndex ก่อน แล้วกําหนดค่าแกนโดยใช้ vAxes ตัวอย่างต่อไปนี้กำหนดชุดที่ 2 ให้กับแกนขวา และระบุชื่อและสไตล์ข้อความที่กำหนดเอง

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

พร็อพเพอร์ตี้นี้อาจเป็นออบเจ็กต์หรืออาร์เรย์ก็ได้ โดยออบเจ็กต์คือคอลเล็กชันของออบเจ็กต์ ซึ่งแต่ละรายการจะมีป้ายกำกับตัวเลขที่ระบุแกนที่กำหนด ซึ่งก็คือรูปแบบที่แสดงด้านบน ส่วนอาร์เรย์คืออาร์เรย์ของออบเจ็กต์ 1 รายการต่อแกน ตัวอย่างเช่น รูปแบบอาร์เรย์ต่อไปนี้จะเหมือนกับออบเจ็กต์ vAxis ที่แสดงด้านบน

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ย่อย
ค่าเริ่มต้น: null
vAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบแกนแนวตั้งต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
ประเภท: object
ค่าเริ่มต้น: null
vAxis.direction

ทิศทางที่ค่าตามแกนแนวตั้งเพิ่มขึ้น โดยค่าเริ่มต้น ค่าต่ำจะอยู่ที่ด้านล่างของแผนภูมิ ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
vAxis.gridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นตารางในแนวตั้ง โปรดทราบว่าเส้นตารางแกนแนวตั้งจะวาดในแนวนอน หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
vAxis.gridlines.color

สีของเส้นตารางแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
vAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
vAxis.logScale

หากเป็น true จะทำให้แกนแนวตั้งเป็นมาตราส่วนเชิงลอนจิทูด หมายเหตุ: ค่าทั้งหมดต้องเป็นค่าบวก

ประเภท: boolean
ค่าเริ่มต้น: false
vAxis.maxValue

ย้ายค่าสูงสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เพิ่มขึ้นในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า y สูงสุดของข้อมูล vAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนแนวตั้ง ซึ่งคล้ายกับตัวเลือก vAxis.gridlines

ประเภท: object
ค่าเริ่มต้น: null
vAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
vAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 จำนวนเส้นกริดย่อยจะขึ้นอยู่กับระยะห่างระหว่างเส้นกริดหลักและพื้นที่ขั้นต่ำที่ต้องการ

ประเภท: number
ค่าเริ่มต้น: 1
vAxis.minValue

ย้ายค่าต่ำสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ลดลงในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า y ขั้นต่ำของข้อมูล vAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: null
vAxis.textPosition

ตำแหน่งของข้อความแกนแนวตั้งสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
vAxis.textStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความของแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

ระบุชื่อแกนแนวตั้ง

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
vAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวตั้ง

ประเภท: object
ค่าเริ่มต้น: null
vAxis.viewWindow.max

ค่าข้อมูลแนวตั้งสูงสุดที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.viewWindow.min

ค่าข้อมูลแนวตั้งขั้นต่ำที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ

ตัวเลือกการกําหนดค่าแผนภูมิคอมโบ

ชื่อ
areaOpacity

ความทึบแสงเริ่มต้นของพื้นที่สีใต้ชุดแผนภูมิพื้นที่ ซึ่ง 0.0 หมายถึงโปร่งแสงทั้งหมด และ 1.0 หมายถึงทึบแสงสนิท หากต้องการระบุระดับความทึบของซีรีส์แต่ละรายการ ให้ตั้งค่า areaOpacity ในพร็อพเพอร์ตี้ series

ประเภท: number, 0.0- 1.0
ค่าเริ่มต้น: 0.3
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของส่วนที่เป็นพื้นในแผนภูมิในรูปแบบสตริงสี HTML

ประเภท: string
ค่าเริ่มต้น: 'white'
chartArea

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าตําแหน่งและขนาดของพื้นที่แผนภูมิ (ที่วาดแผนภูมิเอง ยกเว้นแกนนอนและลําดับชั้น) ระบบรองรับ 2 รูปแบบ ได้แก่ ตัวเลขหรือตัวเลขตามด้วย % ตัวเลขธรรมดาคือค่าในพิกเซล ส่วนตัวเลขตามด้วย % คือเปอร์เซ็นต์ ตัวอย่าง: chartArea:{left:20,top:0,width:'50%',height:'75%'}

ประเภท: object
ค่าเริ่มต้น: null
chartArea.backgroundColor
สีพื้นหลังของพื้นที่แผนภูมิ เมื่อใช้สตริง สตริงดังกล่าวอาจเป็นสตริงฐาน 16 (เช่น '#fdc') หรือชื่อสีภาษาอังกฤษ เมื่อใช้ออบเจ็กต์ คุณสามารถระบุพร็อพเพอร์ตี้ต่อไปนี้ได้
  • stroke: สีที่ระบุเป็นสตริงฐาน 16 หรือชื่อสีภาษาอังกฤษ
  • strokeWidth: หากระบุไว้ ให้วาดเส้นขอบรอบๆ พื้นที่แผนภูมิที่มีความกว้างที่ระบุ (และด้วยสีของ stroke)
ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
chartArea.height

ความสูงของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.left

ระยะห่างระหว่างเส้นขอบด้านซ้ายกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.top

ระยะห่างระหว่างเส้นขอบด้านบนกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.width

ความกว้างของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
curveType

ควบคุมเส้นโค้งของเส้นเมื่อความกว้างของเส้นไม่ใช่ 0 อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'none' - เส้นตรงที่ไม่มีเส้นโค้ง
  • 'function' - ระบบจะปรับมุมของเส้นให้เรียบ
ประเภท:string
ค่าเริ่มต้น: "none"
hAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบในแนวนอนต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
hAxis.direction

ทิศทางที่ค่าตามแกนแนวนอนเพิ่มขึ้น ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
hAxis.gridlines

ออบเจ็กต์ที่มีพร็อพเพอร์ตี้ในการกําหนดค่าเส้นตารางในแนวนอน โปรดทราบว่าเส้นตารางแกนแนวนอนจะวาดในแนวตั้ง หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.gridlines.color

สีของเส้นตารางแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
hAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
hAxis.logScale

พร็อพเพอร์ตี้ hAxis ที่ทำให้แกนนอนเป็นมาตราส่วนเชิงลําดับเลข (ค่าทั้งหมดต้องเป็นค่าบวก) ตั้งค่าเป็น true สำหรับ "ใช่"

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
hAxis.maxValue

ย้ายค่าสูงสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ด้านขวาในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า x สูงสุดของข้อมูล hAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนนอน ซึ่งคล้ายกับตัวเลือก hAxis.gridlines

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
hAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 ตอนนี้จำนวนเส้นกริดย่อยจะขึ้นอยู่กับช่วงเวลาระหว่างเส้นกริดหลัก (ดู hAxis.gridlines.interval) และพื้นที่ขั้นต่ำที่ต้องการ (ดู hAxis.minorGridlines.minSpacing) ทั้งหมด

ประเภท: number
ค่าเริ่มต้น: 1
hAxis.minValue

ย้ายค่าต่ำสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เลื่อนไปทางซ้ายในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า x ขั้นต่ำของข้อมูล hAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.textPosition

ตำแหน่งของข้อความแกนแนวนอนสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
hAxis.textStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความของแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

hAxis พร็อพเพอร์ตี้ที่ระบุชื่อแกนแนวนอน

ประเภท: string
ค่าเริ่มต้น: null
hAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวนอน

ประเภท: object
ค่าเริ่มต้น: null
hAxis.viewWindow.max

ค่าข้อมูลแนวนอนสูงสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.viewWindow.min

ค่าข้อมูลแนวนอนต่ำสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
interpolateNulls

เลือกว่าจะเดาค่าของคะแนนที่ขาดไปหรือไม่ หากเป็น true ระบบจะคาดคะเนค่าของข้อมูลที่ขาดหายไปโดยอิงตามจุดใกล้เคียง หากเป็น false ระบบจะเว้นวรรคในบรรทัด ณ จุดที่ไม่รู้จัก

แผนภูมิพื้นที่ที่มีตัวเลือก isStacked: true/'percent'/'relative'/'absolute' ไม่รองรับตัวเลือกนี้

ประเภท: boolean
ค่าเริ่มต้น: false
isStacked

หากตั้งค่าเป็น true ระบบจะซ้อนองค์ประกอบของทุกชุดค่ายที่ค่าโดเมนแต่ละค่า หมายเหตุ: ในแผนภูมิคอลัมน์ พื้นที่ และ SteppedArea Google Charts จะกลับลําดับของรายการในแผนภูมิเพื่อให้สอดคล้องกับการซ้อนขององค์ประกอบชุดค่างําได้ดีขึ้น (เช่น ชุดที่ 0 จะเป็นรายการในแผนภูมิที่ต่ำที่สุด) กฎนี้ ไม่มีผล กับแผนภูมิแท่ง

ตัวเลือก isStacked ยังรองรับการซ้อน 100% ด้วย โดยระบบจะปรับขนาดกององค์ประกอบที่ค่าโดเมนแต่ละค่าให้รวมกันได้ 100%

ตัวเลือกสำหรับ isStacked มีดังนี้

  • false — องค์ประกอบจะไม่ซ้อนกัน ประเภทการทำงานนี้เป็นค่าเริ่มต้น
  • true — ซ้อนองค์ประกอบของชุดข้อมูลทั้งหมดที่ค่าโดเมนแต่ละค่า
  • 'percent' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 100% โดยค่าขององค์ประกอบแต่ละรายการจะคํานวณเป็นเปอร์เซ็นต์ของ 100%
  • 'relative' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 1 โดยค่าของแต่ละองค์ประกอบจะคํานวณเป็นเศษส่วนของ 1
  • 'absolute' — ทำงานเหมือนกับ isStacked: true

สําหรับการซ้อน 100% ค่าที่คำนวณแล้วของแต่ละองค์ประกอบจะปรากฏในเคล็ดลับเครื่องมือหลังค่าจริง

ค่าเริ่มต้นของแกนเป้าหมายจะเป็นค่าขีดตามสเกล 0-1 แบบสัมพัทธ์เป็นเศษส่วนของ 1 สำหรับ 'relative' และ 0-100% สำหรับ 'percent' (หมายเหตุ: เมื่อใช้ตัวเลือก 'percent' ค่าแกน/ขีดจะแสดงเป็นเปอร์เซ็นต์ แต่ค่าจริงคือค่าสเกล 0-1 แบบสัมพัทธ์ เนื่องจากเครื่องหมายบนแกนเปอร์เซ็นต์เป็นผลมาจากการใช้รูปแบบ "#.##%" กับค่าสเกล 0-1 แบบสัมพัทธ์ เมื่อใช้ isStacked: 'percent' โปรดตรวจสอบว่าได้ระบุเครื่องหมาย/เส้นตารางโดยใช้ค่าสเกลแบบสัมพัทธ์ 0-1) คุณปรับแต่งเส้นตาราง/ค่าการแบ่งแท่งและการจัดรูปแบบได้โดยใช้ตัวเลือก hAxis/vAxis ที่เหมาะสม

การซ้อน 100% รองรับเฉพาะค่าข้อมูลประเภท number เท่านั้น และต้องมีค่าฐานเป็น 0

ประเภท: boolean/string
ค่าเริ่มต้น: false
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legend.position

ตำแหน่งของคำอธิบาย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'bottom' - ใต้แผนภูมิ
  • 'left' - ทางด้านซ้ายของแผนภูมิในกรณีที่แกนด้านซ้ายไม่มีชุดข้อมูลที่เชื่อมโยงอยู่ ดังนั้นหากต้องการให้คำอธิบายทางด้านซ้าย ให้ใช้ตัวเลือก targetAxisIndex: 1
  • 'in' - ภายในแผนภูมิ ตรงมุมซ้ายบน
  • 'none' - ไม่มีการระบุแหล่งที่มา
  • 'right' - ทางด้านขวาของแผนภูมิ ใช้ร่วมกับตัวเลือก vAxes ไม่ได้
  • 'top' - เหนือแผนภูมิ
ประเภท: string
ค่าเริ่มต้น: 'right'
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
lineWidth

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

ประเภท: number
ค่าเริ่มต้น: 2
pointShape

รูปร่างขององค์ประกอบข้อมูลแต่ละรายการ: 'circle', 'triangle', 'square', 'diamond', 'star' หรือ 'polygon' ดูตัวอย่างได้ใน เอกสารประกอบเกี่ยวกับคะแนน

ประเภท: string
ค่าเริ่มต้น: 'circle'
pointSize

เส้นผ่านศูนย์กลางของจุดที่แสดงเป็นพิกเซล ใช้ 0 เพื่อซ่อนจุดทั้งหมด คุณสามารถลบล้างค่าสำหรับชุดหนังสือแต่ละชุดได้โดยใช้พร็อพเพอร์ตี้ series หากคุณใช้เส้นแนวโน้ม ตัวเลือก pointSize จะส่งผลต่อความกว้างของเส้นแนวโน้ม เว้นแต่คุณจะลบล้างด้วยตัวเลือก trendlines.n.pointsize

ประเภท: number
ค่าเริ่มต้น: 0
reverseCategories

หากตั้งค่าเป็น true ระบบจะวาดชุดจากขวาไปซ้าย ค่าเริ่มต้นคือวาดจากซ้ายไปขวา

ตัวเลือกนี้ใช้ได้กับแกน discrete major เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
ซีรีส์

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

  • annotations - ออบเจ็กต์ที่จะใช้กับคำอธิบายประกอบของชุดนี้ ตัวอย่างการใช้เพื่อควบคุม textStyle ของชุดหนังสือมีดังนี้

    series: {
      0: {
        annotations: {
          textStyle: {fontSize: 12, color: 'red' }
        }
      }
    }
              

    ดูตัวเลือก annotations ต่างๆ เพื่อดูรายการที่ปรับแต่งได้ทั้งหมด

  • areaOpacity - ลบล้าง areaOpacity ระดับส่วนกลางสำหรับชุดนี้
  • color - สีที่จะใช้กับชุดข้อมูลนี้ ระบุสตริงสี HTML ที่ถูกต้อง
  • curveType - ลบล้างค่า curveType ระดับส่วนกลางสำหรับชุดนี้
  • fallingColor.fill - ลบล้างค่า candlestick.fallingColor.fill ระดับทั่วทั้งระบบสำหรับชุดนี้
  • fallingColor.stroke - ลบล้างค่า candlestick.fallingColor.stroke ระดับทั่วทั้งระบบสำหรับชุดนี้
  • fallingColor.strokeWidth - ลบล้างค่า candlestick.fallingColor.strokeWidth ระดับทั่วทั้งระบบสำหรับชุดนี้
  • labelInLegend - คําอธิบายชุดที่จะปรากฏในคําอธิบายแผนภูมิ
  • lineDashStyle - ลบล้างค่า lineDashStyle ระดับส่วนกลางสำหรับชุดนี้
  • lineWidth - ลบล้างค่า lineWidth ระดับส่วนกลางสำหรับชุดนี้
  • pointShape - ลบล้างค่า pointShape ระดับส่วนกลางสำหรับชุดนี้
  • pointSize - ลบล้างค่า pointSize ระดับส่วนกลางสำหรับชุดนี้
  • pointsVisible - ลบล้างค่า pointsVisible ระดับส่วนกลางสำหรับชุดนี้
  • risingColor.fill - ลบล้างค่า candlestick.risingColor.fill ระดับทั่วทั้งระบบสำหรับชุดนี้
  • risingColor.stroke - ลบล้างค่า candlestick.risingColor.stroke ระดับทั่วทั้งระบบสำหรับชุดนี้
  • risingColor.strokeWidth - ลบล้างค่า candlestick.risingColor.strokeWidth ระดับทั่วทั้งระบบสำหรับชุดนี้
  • targetAxisIndex - แกนที่จะกำหนดชุดข้อมูลนี้ โดยที่ 0 คือแกนเริ่มต้น และ 1 คือแกนตรงข้าม ค่าเริ่มต้นคือ 0 ให้ตั้งค่าเป็น 1 เพื่อกําหนดแผนภูมิที่แสดงผลอนุกรมต่างๆ บนแกนต่างๆ คุณต้องจัดสรรชุดค่าอย่างน้อย 1 ชุดให้กับแกนเริ่มต้น คุณกําหนดมาตราส่วนที่แตกต่างกันสําหรับแกนต่างๆ ได้
  • type - ประเภทเครื่องหมายของชุดข้อมูลนี้ ค่าที่ใช้ได้คือ "line", "area", 'bars' และ "steppedArea" โปรดทราบว่าแถบคือแถบแนวตั้ง (คอลัมน์) ค่าเริ่มต้นจะระบุโดยตัวเลือก seriesType ของแผนภูมิ
  • visibleInLegend - ค่า boolean โดยที่ true หมายความว่าชุดข้อมูลควรมีรายการคำอธิบายประกอบ และ false หมายความว่าไม่ควรมี ค่าเริ่มต้นคือ true

คุณสามารถระบุอาร์เรย์ของออบเจ็กต์ โดยแต่ละรายการจะมีผลกับชุดหนังสือตามลำดับที่ระบุ หรือจะระบุออบเจ็กต์ที่มีออบเจ็กต์ย่อยแต่ละรายการมีคีย์ตัวเลขที่ระบุชุดหนังสือที่ใช้ก็ได้ ตัวอย่างเช่น การประกาศ 2 รายการต่อไปนี้เหมือนกัน และประกาศชุดที่ 1 เป็นสีดําและไม่มีในคําอธิบายประกอบ และชุดที่ 4 เป็นสีแดงและไม่มีในคําอธิบายประกอบ

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ที่ฝังอยู่
ค่าเริ่มต้น: {}
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ธีม [theme]

ธีมคือชุดค่าตัวเลือกที่กําหนดไว้ล่วงหน้าซึ่งทํางานร่วมกันเพื่อให้ได้ลักษณะการทํางานของแผนภูมิหรือเอฟเฟกต์ภาพที่ต้องการ ปัจจุบันมีธีมเดียวที่ใช้ได้ ดังนี้

  • 'maximized' - ขยายพื้นที่ของแผนภูมิให้ใหญ่ที่สุด และวาดคําอธิบายแผนภูมิและป้ายกำกับทั้งหมดภายในพื้นที่แผนภูมิ
ประเภท: string
ค่าเริ่มต้น: null
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
useFirstColumnAsDomain

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์เป็นโดเมน

ประเภท: boolean
vAxes

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

หากต้องการระบุแผนภูมิที่มีแกนแนวตั้งหลายแกน ให้กําหนดแกนใหม่โดยใช้ series.targetAxisIndex ก่อน แล้วกําหนดค่าแกนโดยใช้ vAxes ตัวอย่างต่อไปนี้กำหนดชุดที่ 2 ให้กับแกนขวา และระบุชื่อและสไตล์ข้อความที่กำหนดเอง

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

พร็อพเพอร์ตี้นี้อาจเป็นออบเจ็กต์หรืออาร์เรย์ก็ได้ โดยออบเจ็กต์คือคอลเล็กชันของออบเจ็กต์ ซึ่งแต่ละรายการจะมีป้ายกำกับตัวเลขที่ระบุแกนที่กำหนด ซึ่งก็คือรูปแบบที่แสดงด้านบน ส่วนอาร์เรย์คืออาร์เรย์ของออบเจ็กต์ 1 รายการต่อแกน ตัวอย่างเช่น รูปแบบอาร์เรย์ต่อไปนี้จะเหมือนกับออบเจ็กต์ vAxis ที่แสดงด้านบน

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ย่อย
ค่าเริ่มต้น: null
vAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบแกนแนวตั้งต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
ประเภท: object
ค่าเริ่มต้น: null
vAxis.direction

ทิศทางที่ค่าตามแกนแนวตั้งเพิ่มขึ้น โดยค่าเริ่มต้น ค่าต่ำจะอยู่ที่ด้านล่างของแผนภูมิ ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
vAxis.gridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นตารางในแนวตั้ง โปรดทราบว่าเส้นตารางแกนแนวตั้งจะวาดในแนวนอน หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
vAxis.gridlines.color

สีของเส้นตารางแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
vAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
vAxis.logScale

หากเป็น true จะทำให้แกนแนวตั้งเป็นมาตราส่วนเชิงลอนจิทูด หมายเหตุ: ค่าทั้งหมดต้องเป็นค่าบวก

ประเภท: boolean
ค่าเริ่มต้น: false
vAxis.maxValue

ย้ายค่าสูงสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เพิ่มขึ้นในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า y สูงสุดของข้อมูล vAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนแนวตั้ง ซึ่งคล้ายกับตัวเลือก vAxis.gridlines

ประเภท: object
ค่าเริ่มต้น: null
vAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
vAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 จำนวนเส้นกริดย่อยจะขึ้นอยู่กับระยะห่างระหว่างเส้นกริดหลักและพื้นที่ขั้นต่ำที่ต้องการ

ประเภท: number
ค่าเริ่มต้น: 1
vAxis.minValue

ย้ายค่าต่ำสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ลดลงในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า y ขั้นต่ำของข้อมูล vAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: null
vAxis.textPosition

ตำแหน่งของข้อความแกนแนวตั้งสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
vAxis.textStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความของแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

ระบุชื่อแกนแนวตั้ง

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
vAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวตั้ง

ประเภท: object
ค่าเริ่มต้น: null
vAxis.viewWindow.max

ค่าข้อมูลแนวตั้งสูงสุดที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.viewWindow.min

ค่าข้อมูลแนวตั้งขั้นต่ำที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ

ตัวเลือกการกำหนดค่าหน้าปัด

ชื่อ
greenColor

สีที่จะใช้สำหรับส่วนสีเขียวในการเขียนคำอธิบายสี HTML

ประเภท: string
ค่าเริ่มต้น: '#109618'
greenFrom

ค่าต่ำสุดของช่วงที่มีเครื่องหมายสีเขียว

ประเภท: number
ค่าเริ่มต้น: ไม่มี
greenTo

ค่าสูงสุดของช่วงที่มีเครื่องหมายสีเขียว

ประเภท: number
ค่าเริ่มต้น: ไม่มี
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความกว้างของคอนเทนเนอร์
สูงสุด

ค่าสูงสุดที่จะแสดงบนแกน Y หากจุดข้อมูลสูงสุดเกินค่านี้ ระบบจะไม่สนใจการตั้งค่านี้ และปรับแผนภูมิให้แสดงเครื่องหมายแท่งหลักถัดไปเหนือจุดข้อมูลสูงสุด ซึ่งจะมีความสำคัญเหนือกว่าค่าสูงสุดของแกน Y ที่ scaleType กำหนด

ซึ่งคล้ายกับ maxValue ในแผนภูมิหลัก

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
นาที

ค่าต่ำสุดที่จะแสดงบนแกน Y หากจุดข้อมูลต่ำสุดน้อยกว่าค่านี้ ระบบจะไม่สนใจการตั้งค่านี้ และปรับแผนภูมิให้แสดงเครื่องหมายแท่งหลักถัดไปใต้จุดข้อมูลต่ำสุด ซึ่งจะมีความสำคัญเหนือกว่าค่าต่ำสุดบนแกน Y ที่ระบุโดย scaleType

ซึ่งคล้ายกับ minValue ในแผนภูมิหลัก

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
redColor

สีที่จะใช้สำหรับส่วนสีแดงในการเขียนคำอธิบายสี HTML

ประเภท: string
ค่าเริ่มต้น: '#DC3912'
redFrom

ค่าต่ำสุดของช่วงที่มีเครื่องหมายสีแดง

ประเภท: number
ค่าเริ่มต้น: ไม่มี
redTo

ค่าสูงสุดของช่วงที่มีเครื่องหมายสีแดง

ประเภท: number
ค่าเริ่มต้น: ไม่มี
ความกว้าง

ความกว้างของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความกว้างของคอนเทนเนอร์
yellowColor

สีที่จะใช้สำหรับส่วนสีเหลืองในสัญลักษณ์สี HTML

ประเภท: string
ค่าเริ่มต้น: '#FF9900'
yellowFrom

ค่าต่ำสุดของช่วงที่มีเครื่องหมายสีเหลือง

ประเภท: number
ค่าเริ่มต้น: ไม่มี
yellowTo

ค่าสูงสุดของช่วงที่มีเครื่องหมายสีเหลือง

ประเภท: number
ค่าเริ่มต้น: ไม่มี

ตัวเลือกการกําหนดค่าแผนภูมิภูมิศาสตร์

ชื่อ
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของส่วนที่เป็นพื้นในแผนภูมิในรูปแบบสตริงสี HTML

ประเภท: string
ค่าเริ่มต้น: 'white'
datalessRegionColor

สีที่จะกำหนดให้กับภูมิภาคที่ไม่มีข้อมูลที่เกี่ยวข้อง

ประเภท: string
ค่าเริ่มต้น: '#F5F5F5'
defaultColor

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

ประเภท: string
ค่าเริ่มต้น: '#267114'
displayMode

ประเภทของแผนภูมิภูมิศาสตร์ รูปแบบ DataTable ต้องตรงกับค่าที่ระบุ ค่าที่รองรับมีดังนี้

  • 'auto' - เลือกตามรูปแบบของ DataTable
  • 'regions' - ระบายสีภูมิภาคในแผนภูมิภูมิศาสตร์
  • 'markers' - วางเครื่องหมายในภูมิภาค
  • 'text' - ติดป้ายกำกับภูมิภาคด้วยข้อความจาก DataTable
ประเภท: string
ค่าเริ่มต้น: "auto"
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ภูมิภาค

พื้นที่ที่จะแสดงในแผนภูมิภูมิศาสตร์ พื้นที่โดยรอบจะแสดงด้วย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'world' - แผนภูมิภูมิศาสตร์ของโลกทั้งใบ
  • ทวีปหรือทวีปย่อยที่ระบุด้วยรหัส 3 หลัก เช่น '011' สำหรับแอฟริกาตะวันตก
  • ประเทศที่ระบุด้วยรหัส ISO 3166-1 alpha-2 เช่น 'AU' สำหรับออสเตรเลีย
  • รัฐในสหรัฐอเมริกาที่ระบุด้วยรหัส ISO 3166-2:US เช่น 'US-AL' สำหรับแอละแบมา โปรดทราบว่าต้องตั้งค่าตัวเลือก resolution เป็น 'provinces' หรือ 'metros'
ประเภท: string
ค่าเริ่มต้น: "world"
ความกว้าง

ความกว้างของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความกว้างขององค์ประกอบที่บรรจุ

ตัวเลือกการกําหนดค่าฮิสโตแกรม

ชื่อ
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของส่วนที่เป็นพื้นในแผนภูมิในรูปแบบสตริงสี HTML

ประเภท: string
ค่าเริ่มต้น: 'white'
chartArea

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าตําแหน่งและขนาดของพื้นที่แผนภูมิ (ที่วาดแผนภูมิเอง ยกเว้นแกนนอนและลําดับชั้น) ระบบรองรับ 2 รูปแบบ ได้แก่ ตัวเลขหรือตัวเลขตามด้วย % ตัวเลขธรรมดาคือค่าในพิกเซล ส่วนตัวเลขตามด้วย % คือเปอร์เซ็นต์ ตัวอย่าง: chartArea:{left:20,top:0,width:'50%',height:'75%'}

ประเภท: object
ค่าเริ่มต้น: null
chartArea.backgroundColor
สีพื้นหลังของพื้นที่แผนภูมิ เมื่อใช้สตริง สตริงดังกล่าวอาจเป็นสตริงฐาน 16 (เช่น '#fdc') หรือชื่อสีภาษาอังกฤษ เมื่อใช้ออบเจ็กต์ คุณสามารถระบุพร็อพเพอร์ตี้ต่อไปนี้ได้
  • stroke: สีที่ระบุเป็นสตริงฐาน 16 หรือชื่อสีภาษาอังกฤษ
  • strokeWidth: หากระบุไว้ ให้วาดเส้นขอบรอบๆ พื้นที่แผนภูมิที่มีความกว้างที่ระบุ (และด้วยสีของ stroke)
ประเภท: string หรือ object/div>
ค่าเริ่มต้น: 'white'
chartArea.height

ความสูงของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.left

ระยะห่างระหว่างเส้นขอบด้านซ้ายกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.top

ระยะห่างระหว่างเส้นขอบด้านบนกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.width

ความกว้างของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
hAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบในแนวนอนต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
hAxis.gridlines

ออบเจ็กต์ที่มีพร็อพเพอร์ตี้ในการกําหนดค่าเส้นตารางในแนวนอน โปรดทราบว่าเส้นตารางแกนแนวนอนจะวาดในแนวตั้ง หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.gridlines.color

สีของเส้นตารางแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
hAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
hAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนนอน ซึ่งคล้ายกับตัวเลือก hAxis.gridlines

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
hAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 ตอนนี้จำนวนเส้นกริดย่อยจะขึ้นอยู่กับช่วงเวลาระหว่างเส้นกริดหลัก (ดู hAxis.gridlines.interval) และพื้นที่ขั้นต่ำที่ต้องการ (ดู hAxis.minorGridlines.minSpacing) ทั้งหมด

ประเภท: number
ค่าเริ่มต้น: 1
hAxis.textPosition

ตำแหน่งของข้อความแกนแนวนอนสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
hAxis.textStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความของแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

hAxis พร็อพเพอร์ตี้ที่ระบุชื่อแกนแนวนอน

ประเภท: string
ค่าเริ่มต้น: null
hAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวนอน

ประเภท: object
ค่าเริ่มต้น: null
hAxis.viewWindow.max

ค่าข้อมูลแนวนอนสูงสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.viewWindow.min

ค่าข้อมูลแนวนอนต่ำสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
histogram.bucketSize

กำหนดขนาดของแถบฮิสโตแกรมแต่ละแถบอย่างเจาะจงแทนที่จะให้ระบบกำหนดตามอัลกอริทึม

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
histogram.hideBucketItems

ลบเส้นแบ่งบางๆ ระหว่างบล็อกของฮิสโตแกรมออก แล้วเปลี่ยนให้เป็นแถบต่อเนื่อง

ประเภท: boolean
ค่าเริ่มต้น: false
histogram.lastBucketPercentile

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

ประเภท: number
ค่าเริ่มต้น: 0
interpolateNulls

เลือกว่าจะเดาค่าของคะแนนที่ขาดไปหรือไม่ หากเป็น true ระบบจะคาดคะเนค่าของข้อมูลที่ขาดหายไปโดยอิงตามจุดใกล้เคียง หากเป็น false ระบบจะเว้นวรรคในบรรทัด ณ จุดที่ไม่รู้จัก

แผนภูมิพื้นที่ที่มีตัวเลือก isStacked: true/'percent'/'relative'/'absolute' ไม่รองรับตัวเลือกนี้

ประเภท: boolean
ค่าเริ่มต้น: false
isStacked

หากตั้งค่าเป็น true ระบบจะซ้อนองค์ประกอบของทุกชุดค่ายที่ค่าโดเมนแต่ละค่า หมายเหตุ: ในแผนภูมิคอลัมน์ พื้นที่ และ SteppedArea Google Charts จะกลับลําดับของรายการในแผนภูมิเพื่อให้สอดคล้องกับการซ้อนขององค์ประกอบชุดค่างําได้ดีขึ้น (เช่น ชุดที่ 0 จะเป็นรายการในแผนภูมิที่ต่ำที่สุด) กฎนี้ ไม่มีผล กับแผนภูมิแท่ง

ตัวเลือก isStacked ยังรองรับการซ้อน 100% ด้วย โดยระบบจะปรับขนาดกององค์ประกอบที่ค่าโดเมนแต่ละค่าใหม่เพื่อให้รวมกันได้ 100%

ตัวเลือกสำหรับ isStacked มีดังนี้

  • false — องค์ประกอบจะไม่ซ้อนกัน ประเภทการทำงานนี้เป็นค่าเริ่มต้น
  • true — ซ้อนองค์ประกอบของชุดข้อมูลทั้งหมดที่ค่าโดเมนแต่ละค่า
  • 'percent' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 100% โดยค่าขององค์ประกอบแต่ละรายการจะคํานวณเป็นเปอร์เซ็นต์ของ 100%
  • 'relative' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 1 โดยค่าของแต่ละองค์ประกอบจะคํานวณเป็นเศษส่วนของ 1
  • 'absolute' — ทำงานเหมือนกับ isStacked: true

สําหรับการซ้อน 100% ค่าที่คำนวณแล้วของแต่ละองค์ประกอบจะปรากฏในเคล็ดลับเครื่องมือหลังค่าจริง

ค่าเริ่มต้นของแกนเป้าหมายจะเป็นค่าขีดตามสเกล 0-1 แบบสัมพัทธ์เป็นเศษส่วนของ 1 สำหรับ 'relative' และ 0-100% สำหรับ 'percent' (หมายเหตุ: เมื่อใช้ตัวเลือก 'percent' ค่าแกน/ขีดจะแสดงเป็นเปอร์เซ็นต์ แต่ค่าจริงคือค่าสเกล 0-1 แบบสัมพัทธ์ เนื่องจากเครื่องหมายบนแกนเปอร์เซ็นต์เป็นผลมาจากการใช้รูปแบบ "#.##%" กับค่าสเกล 0-1 แบบสัมพัทธ์ เมื่อใช้ isStacked: 'percent' โปรดตรวจสอบว่าได้ระบุเครื่องหมาย/เส้นตารางโดยใช้ค่าสเกลแบบสัมพัทธ์ 0-1) คุณปรับแต่งเส้นตาราง/ค่าการแบ่งแท่งและการจัดรูปแบบได้โดยใช้ตัวเลือก hAxis/vAxis ที่เหมาะสม

การซ้อน 100% รองรับเฉพาะค่าข้อมูลประเภท number เท่านั้น และต้องมีค่าฐานเป็น 0

ประเภท: boolean/string
ค่าเริ่มต้น: false
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legend.position

ตำแหน่งของคำอธิบาย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'bottom' - ใต้แผนภูมิ
  • 'left' - ทางด้านซ้ายของแผนภูมิในกรณีที่แกนด้านซ้ายไม่มีชุดข้อมูลที่เชื่อมโยงอยู่ ดังนั้นหากต้องการให้คำอธิบายทางด้านซ้าย ให้ใช้ตัวเลือก targetAxisIndex: 1
  • 'in' - ภายในแผนภูมิ ตรงมุมซ้ายบน
  • 'none' - ไม่มีการระบุแหล่งที่มา
  • 'right' - ทางด้านขวาของแผนภูมิ ใช้ร่วมกับตัวเลือก vAxes ไม่ได้
  • 'top' - เหนือแผนภูมิ
ประเภท: string
ค่าเริ่มต้น: 'right'
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

หากตั้งค่าเป็น true ระบบจะวาดชุดจากขวาไปซ้าย ค่าเริ่มต้นคือวาดจากซ้ายไปขวา

ตัวเลือกนี้ใช้ได้กับแกน discrete major เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
ซีรีส์

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

  • color - สีที่จะใช้กับชุดข้อมูลนี้ ระบุสตริงสี HTML ที่ถูกต้อง
  • labelInLegend - คําอธิบายชุดที่จะปรากฏในคําอธิบายแผนภูมิ
  • targetAxisIndex - แกนที่จะกำหนดชุดข้อมูลนี้ โดยที่ 0 คือแกนเริ่มต้น และ 1 คือแกนตรงข้าม ค่าเริ่มต้นคือ 0 ให้ตั้งค่าเป็น 1 เพื่อกําหนดแผนภูมิที่แสดงผลอนุกรมต่างๆ บนแกนต่างๆ คุณต้องจัดสรรชุดค่าอย่างน้อย 1 ชุดให้กับแกนเริ่มต้น คุณกําหนดมาตราส่วนที่แตกต่างกันสําหรับแกนต่างๆ ได้
  • visibleInLegend - ค่า boolean โดยที่ true หมายความว่าชุดข้อมูลควรมีรายการคำอธิบายประกอบ และ false หมายความว่าไม่ควรมี ค่าเริ่มต้นคือ true

คุณสามารถระบุอาร์เรย์ของออบเจ็กต์ โดยแต่ละรายการจะมีผลกับชุดหนังสือตามลำดับที่ระบุ หรือจะระบุออบเจ็กต์ที่มีออบเจ็กต์ย่อยแต่ละรายการมีคีย์ตัวเลขที่ระบุชุดหนังสือที่ใช้ก็ได้ ตัวอย่างเช่น การประกาศ 2 รายการต่อไปนี้เหมือนกัน และประกาศชุดที่ 1 เป็นสีดําและไม่มีในคําอธิบายประกอบ และชุดที่ 4 เป็นสีแดงและไม่มีในคําอธิบายประกอบ

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ที่ฝังอยู่
ค่าเริ่มต้น: {}
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ธีม [theme]

ธีมคือชุดค่าตัวเลือกที่กําหนดไว้ล่วงหน้าซึ่งทํางานร่วมกันเพื่อให้ได้ลักษณะการทํางานของแผนภูมิหรือเอฟเฟกต์ภาพที่ต้องการ ปัจจุบันมีธีมเดียวที่ใช้ได้ ดังนี้

  • 'maximized' - ขยายพื้นที่ของแผนภูมิให้ใหญ่ที่สุด และวาดคําอธิบายแผนภูมิและป้ายกำกับทั้งหมดภายในพื้นที่แผนภูมิ
ประเภท: string
ค่าเริ่มต้น: null
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
useFirstColumnAsDomain

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์เป็นโดเมน

ประเภท: boolean
vAxes

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

หากต้องการระบุแผนภูมิที่มีแกนแนวตั้งหลายแกน ให้กําหนดแกนใหม่โดยใช้ series.targetAxisIndex ก่อน แล้วกําหนดค่าแกนโดยใช้ vAxes ตัวอย่างต่อไปนี้กำหนดชุดที่ 2 ให้กับแกนขวา และระบุชื่อและสไตล์ข้อความที่กำหนดเอง

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

พร็อพเพอร์ตี้นี้อาจเป็นออบเจ็กต์หรืออาร์เรย์ก็ได้ โดยออบเจ็กต์คือคอลเล็กชันของออบเจ็กต์ ซึ่งแต่ละรายการจะมีป้ายกำกับตัวเลขที่ระบุแกนที่กำหนด ซึ่งก็คือรูปแบบที่แสดงด้านบน ส่วนอาร์เรย์คืออาร์เรย์ของออบเจ็กต์ 1 รายการต่อแกน ตัวอย่างเช่น รูปแบบอาร์เรย์ต่อไปนี้จะเหมือนกับออบเจ็กต์ vAxis ที่แสดงด้านบน

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ย่อย
ค่าเริ่มต้น: null
vAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบแกนแนวตั้งต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
ประเภท: object
ค่าเริ่มต้น: null
vAxis.direction

ทิศทางที่ค่าตามแกนแนวตั้งเพิ่มขึ้น โดยค่าเริ่มต้น ค่าต่ำจะอยู่ที่ด้านล่างของแผนภูมิ ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
vAxis.gridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นตารางในแนวตั้ง โปรดทราบว่าเส้นตารางแกนแนวตั้งจะวาดในแนวนอน หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
vAxis.gridlines.color

สีของเส้นตารางแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
vAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
vAxis.logScale

หากเป็น true จะทำให้แกนแนวตั้งเป็นมาตราส่วนเชิงลอนจิทูด หมายเหตุ: ค่าทั้งหมดต้องเป็นค่าบวก

ประเภท: boolean
ค่าเริ่มต้น: false
vAxis.maxValue

ย้ายค่าสูงสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เพิ่มขึ้นในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า y สูงสุดของข้อมูล vAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนแนวตั้ง ซึ่งคล้ายกับตัวเลือก vAxis.gridlines

ประเภท: object
ค่าเริ่มต้น: null
vAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
vAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 จำนวนเส้นกริดย่อยจะขึ้นอยู่กับระยะห่างระหว่างเส้นกริดหลักและพื้นที่ขั้นต่ำที่ต้องการ

ประเภท: number
ค่าเริ่มต้น: 1
vAxis.minValue

ย้ายค่าต่ำสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ลดลงในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า y ขั้นต่ำของข้อมูล vAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: null
vAxis.textPosition

ตำแหน่งของข้อความแกนแนวตั้งสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
vAxis.textStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความของแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

ระบุชื่อแกนแนวตั้ง

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
vAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวตั้ง

ประเภท: object
ค่าเริ่มต้น: null
vAxis.viewWindow.max

ค่าข้อมูลแนวตั้งสูงสุดที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.viewWindow.min

ค่าข้อมูลแนวตั้งขั้นต่ำที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ความกว้าง

ความกว้างของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความกว้างขององค์ประกอบที่บรรจุ

ตัวเลือกการกําหนดค่าแผนภูมิเส้น

ชื่อ
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของส่วนที่เป็นพื้นในแผนภูมิในรูปแบบสตริงสี HTML

ประเภท: string
ค่าเริ่มต้น: 'white'
chartArea

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าตําแหน่งและขนาดของพื้นที่แผนภูมิ (ที่วาดแผนภูมิเอง ยกเว้นแกนนอนและลําดับชั้น) ระบบรองรับ 2 รูปแบบ ได้แก่ ตัวเลขหรือตัวเลขตามด้วย % ตัวเลขธรรมดาคือค่าในพิกเซล ส่วนตัวเลขตามด้วย % คือเปอร์เซ็นต์ ตัวอย่าง: chartArea:{left:20,top:0,width:'50%',height:'75%'}

ประเภท: object
ค่าเริ่มต้น: null
chartArea.backgroundColor
สีพื้นหลังของพื้นที่แผนภูมิ เมื่อใช้สตริง สตริงดังกล่าวอาจเป็นสตริงฐาน 16 (เช่น '#fdc') หรือชื่อสีภาษาอังกฤษ เมื่อใช้ออบเจ็กต์ คุณสามารถระบุพร็อพเพอร์ตี้ต่อไปนี้ได้
  • stroke: สีที่ระบุเป็นสตริงฐาน 16 หรือชื่อสีภาษาอังกฤษ
  • strokeWidth: หากระบุไว้ ให้วาดเส้นขอบรอบๆ พื้นที่แผนภูมิที่มีความกว้างที่ระบุ (และด้วยสีของ stroke)
ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
chartArea.height

ความสูงของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.left

ระยะห่างระหว่างเส้นขอบด้านซ้ายกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.top

ระยะห่างระหว่างเส้นขอบด้านบนกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.width

ความกว้างของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
curveType

ควบคุมเส้นโค้งของเส้นเมื่อความกว้างของเส้นไม่ใช่ 0 อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'none' - เส้นตรงที่ไม่มีเส้นโค้ง
  • 'function' - ระบบจะปรับมุมของเส้นให้เรียบ
ประเภท: string
ค่าเริ่มต้น: "none"
hAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบในแนวนอนต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
hAxis.direction

ทิศทางที่ค่าตามแกนแนวนอนเพิ่มขึ้น ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
hAxis.gridlines

ออบเจ็กต์ที่มีพร็อพเพอร์ตี้ในการกําหนดค่าเส้นตารางในแนวนอน โปรดทราบว่าเส้นตารางแกนแนวนอนจะวาดในแนวตั้ง หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.gridlines.color

สีของเส้นตารางแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
hAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
hAxis.logScale

พร็อพเพอร์ตี้ hAxis ที่ทำให้แกนนอนเป็นมาตราส่วนเชิงลําดับเลข (ค่าทั้งหมดต้องเป็นค่าบวก) ตั้งค่าเป็น true สำหรับ "ใช่"

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
hAxis.maxValue

ย้ายค่าสูงสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ด้านขวาในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า x สูงสุดของข้อมูล hAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนนอน ซึ่งคล้ายกับตัวเลือก hAxis.gridlines

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท:string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
hAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 ตอนนี้จำนวนเส้นกริดย่อยจะขึ้นอยู่กับช่วงเวลาระหว่างเส้นกริดหลัก (ดู hAxis.gridlines.interval) และพื้นที่ขั้นต่ำที่ต้องการ (ดู hAxis.minorGridlines.minSpacing) ทั้งหมด

ประเภท: number
ค่าเริ่มต้น: 1
hAxis.minValue

ย้ายค่าต่ำสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เลื่อนไปทางซ้ายในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า x ขั้นต่ำของข้อมูล hAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.textPosition

ตำแหน่งของข้อความแกนแนวนอนสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
hAxis.textStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความของแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

hAxis พร็อพเพอร์ตี้ที่ระบุชื่อแกนแนวนอน

ประเภท: string
ค่าเริ่มต้น: null
hAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวนอน

ประเภท: object
ค่าเริ่มต้น: null
hAxis.viewWindow.max

ค่าข้อมูลแนวนอนสูงสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.viewWindow.min

ค่าข้อมูลแนวนอนต่ำสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
interpolateNulls

เลือกว่าจะเดาค่าของคะแนนที่ขาดไปหรือไม่ หากเป็น true ระบบจะคาดคะเนค่าของข้อมูลที่ขาดหายไปโดยอิงตามจุดใกล้เคียง หากเป็น false ระบบจะเว้นวรรคในบรรทัด ณ จุดที่ไม่รู้จัก

แผนภูมิพื้นที่ที่มีตัวเลือก isStacked: true/'percent'/'relative'/'absolute' ไม่รองรับตัวเลือกนี้

ประเภท: boolean
ค่าเริ่มต้น: false
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legend.position

ตำแหน่งของคำอธิบาย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'bottom' - ใต้แผนภูมิ
  • 'left' - ทางด้านซ้ายของแผนภูมิในกรณีที่แกนด้านซ้ายไม่มีชุดข้อมูลที่เชื่อมโยงอยู่ ดังนั้นหากต้องการให้คำอธิบายทางด้านซ้าย ให้ใช้ตัวเลือก targetAxisIndex: 1
  • 'in' - ภายในแผนภูมิ ตรงมุมซ้ายบน
  • 'none' - ไม่มีการระบุแหล่งที่มา
  • 'right' - ทางด้านขวาของแผนภูมิ ใช้ร่วมกับตัวเลือก vAxes ไม่ได้
  • 'top' - เหนือแผนภูมิ
ประเภท: string
ค่าเริ่มต้น: 'right'
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
lineWidth

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

ประเภท: number
ค่าเริ่มต้น: 2
pointShape

รูปร่างขององค์ประกอบข้อมูลแต่ละรายการ: 'circle', 'triangle', 'square', 'diamond', 'star' หรือ 'polygon' ดูตัวอย่างได้ใน เอกสารประกอบเกี่ยวกับคะแนน

ประเภท: string
ค่าเริ่มต้น: 'circle'
pointSize

เส้นผ่านศูนย์กลางของจุดที่แสดงเป็นพิกเซล ใช้ 0 เพื่อซ่อนจุดทั้งหมด คุณสามารถลบล้างค่าสำหรับชุดหนังสือแต่ละชุดได้โดยใช้พร็อพเพอร์ตี้ series หากคุณใช้เส้นแนวโน้ม ตัวเลือก pointSize จะส่งผลต่อความกว้างของเส้นแนวโน้ม เว้นแต่คุณจะลบล้างด้วยตัวเลือก trendlines.n.pointsize

ประเภท: number
ค่าเริ่มต้น: 0
reverseCategories

หากตั้งค่าเป็น true ระบบจะวาดชุดจากขวาไปซ้าย ค่าเริ่มต้นคือวาดจากซ้ายไปขวา

ตัวเลือกนี้ใช้ได้กับแกน discrete major เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
ซีรีส์

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

  • annotations - ออบเจ็กต์ที่จะใช้กับคำอธิบายประกอบของชุดนี้ ตัวอย่างการใช้เพื่อควบคุม textStyle ของชุดหนังสือมีดังนี้

    series: {
      0: {
        annotations: {
          textStyle: {fontSize: 12, color: 'red' }
        }
      }
    }
              

    ดูตัวเลือก annotations ต่างๆ เพื่อดูรายการที่ปรับแต่งได้ทั้งหมด

  • type - ประเภทเครื่องหมายของชุดข้อมูลนี้ ค่าที่ใช้ได้คือ "line", "area", 'bars' และ "steppedArea" โปรดทราบว่าแถบคือแถบแนวตั้ง (คอลัมน์) ค่าเริ่มต้นจะระบุโดยตัวเลือก seriesType ของแผนภูมิ
  • color - สีที่จะใช้กับชุดข้อมูลนี้ ระบุสตริงสี HTML ที่ถูกต้อง
  • curveType - ลบล้างค่า curveType ระดับส่วนกลางสำหรับชุดนี้
  • labelInLegend - คําอธิบายชุดที่จะปรากฏในคําอธิบายแผนภูมิ
  • lineDashStyle - ลบล้างค่า lineDashStyle ระดับส่วนกลางสำหรับชุดนี้
  • lineWidth - ลบล้างค่า lineWidth ระดับส่วนกลางสำหรับชุดนี้
  • pointShape - ลบล้างค่า pointShape ระดับส่วนกลางสำหรับชุดนี้
  • pointSize - ลบล้างค่า pointSize ระดับส่วนกลางสำหรับชุดนี้
  • pointsVisible - ลบล้างค่า pointsVisible ระดับส่วนกลางสำหรับชุดนี้
  • targetAxisIndex - แกนที่จะกำหนดชุดข้อมูลนี้ โดยที่ 0 คือแกนเริ่มต้น และ 1 คือแกนตรงข้าม ค่าเริ่มต้นคือ 0 ให้ตั้งค่าเป็น 1 เพื่อกําหนดแผนภูมิที่แสดงผลอนุกรมต่างๆ บนแกนต่างๆ คุณต้องจัดสรรชุดค่าอย่างน้อย 1 ชุดให้กับแกนเริ่มต้น คุณกําหนดมาตราส่วนที่แตกต่างกันสําหรับแกนต่างๆ ได้
  • visibleInLegend - ค่า boolean โดยที่ true หมายความว่าชุดข้อมูลควรมีรายการคำอธิบายประกอบ และ false หมายความว่าไม่ควรมี ค่าเริ่มต้นคือ true

คุณสามารถระบุอาร์เรย์ของออบเจ็กต์ โดยแต่ละรายการจะมีผลกับชุดหนังสือตามลำดับที่ระบุ หรือจะระบุออบเจ็กต์ที่มีออบเจ็กต์ย่อยแต่ละรายการมีคีย์ตัวเลขที่ระบุชุดหนังสือที่ใช้ก็ได้ ตัวอย่างเช่น การประกาศ 2 รายการต่อไปนี้เหมือนกัน และประกาศชุดที่ 1 เป็นสีดําและไม่มีในคําอธิบายประกอบ และชุดที่ 4 เป็นสีแดงและไม่มีในคําอธิบายประกอบ

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ที่ฝังอยู่
ค่าเริ่มต้น: {}
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ธีม [theme]

ธีมคือชุดค่าตัวเลือกที่กําหนดไว้ล่วงหน้าซึ่งทํางานร่วมกันเพื่อให้ได้ลักษณะการทํางานของแผนภูมิหรือเอฟเฟกต์ภาพที่ต้องการ ปัจจุบันมีธีมเดียวที่ใช้ได้ ดังนี้

  • 'maximized' - ขยายพื้นที่ของแผนภูมิให้ใหญ่ที่สุด และวาดคําอธิบายแผนภูมิและป้ายกำกับทั้งหมดภายในพื้นที่แผนภูมิ
ประเภท: string
ค่าเริ่มต้น: null
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
treatLabelsAsText

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์นั้นเป็นคอลัมน์ข้อความ

ประเภท: boolean
เส้นแนวโน้ม

แสดงเส้นแนวโน้ม ในแผนภูมิที่รองรับ โดยค่าเริ่มต้น ระบบจะใช้เส้นแนวโน้ม linear แต่คุณปรับแต่งได้ด้วยตัวเลือก trendlines.n.type

เส้นแนวโน้มจะระบุตามอนุกรม ดังนั้นตัวเลือกของคุณจึงมักจะมีลักษณะดังนี้

var options = {
  trendlines: {
    0: {
      type: 'linear',
      color: 'green',
      lineWidth: 3,
      opacity: 0.3,
      visibleInLegend: true
    }
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
trendlines.n.color

สีของ เส้นแนวโน้ม ซึ่งแสดงเป็นชื่อสีภาษาอังกฤษหรือสตริงฐาน 16

ประเภท: string
ค่าเริ่มต้น: สีชุดเริ่มต้น
trendlines.n.degree

สำหรับ เส้นแนวโน้ม ของ type: 'polynomial' ดีกรีของพหุนาม (2 สำหรับแบบ 2 ตัวแปร 3 สำหรับแบบ 3 ตัวแปร และอื่นๆ)

ประเภท: number
ค่าเริ่มต้น: 3
trendlines.n.labelInLegend

หากตั้งค่าไว้ เส้นแนวโน้ม จะปรากฏในคำอธิบายเป็นสตริงนี้

ประเภท: string
ค่าเริ่มต้น: null
trendlines.n.lineWidth

ความกว้างของเส้นของเส้นแนวโน้ม ในหน่วยพิกเซล

ประเภท: number
ค่าเริ่มต้น: 2
trendlines.n.type

เส้นแนวโน้ม เป็น 'linear' (ค่าเริ่มต้น), 'exponential' หรือ 'polynomial'

ประเภท: string
ค่าเริ่มต้น: linear
trendlines.n.visibleInLegend

สมการของเส้นแนวโน้มจะปรากฏในคำอธิบายหรือไม่ ซึ่งจะปรากฏในเคล็ดลับเครื่องมือของเส้นแนวโน้ม

ประเภท: boolean
ค่าเริ่มต้น: false
useFirstColumnAsDomain

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์เป็นโดเมน

ประเภท: boolean
vAxes

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

หากต้องการระบุแผนภูมิที่มีแกนแนวตั้งหลายแกน ให้กําหนดแกนใหม่โดยใช้ series.targetAxisIndex ก่อน แล้วกําหนดค่าแกนโดยใช้ vAxes ตัวอย่างต่อไปนี้กำหนดชุดที่ 2 ให้กับแกนขวา และระบุชื่อและสไตล์ข้อความที่กำหนดเอง

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

พร็อพเพอร์ตี้นี้อาจเป็นออบเจ็กต์หรืออาร์เรย์ก็ได้ โดยออบเจ็กต์คือคอลเล็กชันของออบเจ็กต์ ซึ่งแต่ละรายการจะมีป้ายกำกับตัวเลขที่ระบุแกนที่กำหนด ซึ่งก็คือรูปแบบที่แสดงด้านบน ส่วนอาร์เรย์คืออาร์เรย์ของออบเจ็กต์ 1 รายการต่อแกน ตัวอย่างเช่น รูปแบบอาร์เรย์ต่อไปนี้จะเหมือนกับออบเจ็กต์ vAxis ที่แสดงด้านบน

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ย่อย
ค่าเริ่มต้น: null
vAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบแกนแนวตั้งต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
ประเภท: object
ค่าเริ่มต้น: null
vAxis.direction

ทิศทางที่ค่าตามแกนแนวตั้งเพิ่มขึ้น โดยค่าเริ่มต้น ค่าต่ำจะอยู่ที่ด้านล่างของแผนภูมิ ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
vAxis.gridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นตารางในแนวตั้ง โปรดทราบว่าเส้นตารางแกนแนวตั้งจะวาดในแนวนอน หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
vAxis.gridlines.color

สีของเส้นตารางแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
vAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
vAxis.logScale

หากเป็น true จะทำให้แกนแนวตั้งเป็นมาตราส่วนเชิงลอนจิทูด หมายเหตุ: ค่าทั้งหมดต้องเป็นค่าบวก

ประเภท: boolean
ค่าเริ่มต้น: false
vAxis.maxValue

ย้ายค่าสูงสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เพิ่มขึ้นในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า y สูงสุดของข้อมูล vAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนแนวตั้ง ซึ่งคล้ายกับตัวเลือก vAxis.gridlines

ประเภท: object
ค่าเริ่มต้น: null
vAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
vAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 จำนวนเส้นกริดย่อยจะขึ้นอยู่กับระยะห่างระหว่างเส้นกริดหลักและพื้นที่ขั้นต่ำที่ต้องการ

ประเภท: number
ค่าเริ่มต้น: 1
vAxis.minValue

ย้ายค่าต่ำสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ลดลงในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า y ขั้นต่ำของข้อมูล vAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: null
vAxis.textPosition

ตำแหน่งของข้อความแกนแนวตั้งสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
vAxis.textStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความของแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

ระบุชื่อแกนแนวตั้ง

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
vAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวตั้ง

ประเภท: object
ค่าเริ่มต้น: null
vAxis.viewWindow.max

ค่าข้อมูลแนวตั้งสูงสุดที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.viewWindow.min

ค่าข้อมูลแนวตั้งขั้นต่ำที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ

ตัวเลือกการกำหนดค่าแผนภูมิองค์กร

ชื่อ
สี

สีพื้นหลังขององค์ประกอบแผนผังองค์กร

ประเภท: string
ค่าเริ่มต้น: '#edf7ff'
selectionColor

สีพื้นหลังขององค์ประกอบแผนภูมิองค์กรที่เลือก

ประเภท: string
ค่าเริ่มต้น: '#d6e9f8'
ขนาด

ขนาดโดยรวมของแผนภูมิ ตัวเลือก ได้แก่ 'small', 'medium' หรือ 'large'

ประเภท: string
ค่าเริ่มต้น: 'medium'

ตัวเลือกการกำหนดค่าแผนภูมิวงกลม

ชื่อ
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของส่วนที่เป็นพื้นในแผนภูมิในรูปแบบสตริงสี HTML

ประเภท: string
ค่าเริ่มต้น: 'white'
chartArea

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าตําแหน่งและขนาดของพื้นที่แผนภูมิ (ที่วาดแผนภูมิเอง ยกเว้นแกนนอนและลําดับชั้น) ระบบรองรับ 2 รูปแบบ ได้แก่ ตัวเลขหรือตัวเลขตามด้วย % ตัวเลขธรรมดาคือค่าในพิกเซล ส่วนตัวเลขตามด้วย % คือเปอร์เซ็นต์ ตัวอย่าง: chartArea:{left:20,top:0,width:'50%',height:'75%'}

ประเภท: object
ค่าเริ่มต้น: null
chartArea.backgroundColor
สีพื้นหลังของพื้นที่แผนภูมิ เมื่อใช้สตริง สตริงดังกล่าวอาจเป็นสตริงฐาน 16 (เช่น '#fdc') หรือชื่อสีภาษาอังกฤษ เมื่อใช้ออบเจ็กต์ คุณสามารถระบุพร็อพเพอร์ตี้ต่อไปนี้ได้
  • stroke: สีที่ระบุเป็นสตริงฐาน 16 หรือชื่อสีภาษาอังกฤษ
  • strokeWidth: หากระบุไว้ ให้วาดเส้นขอบรอบๆ พื้นที่แผนภูมิที่มีความกว้างที่ระบุ (และด้วยสีของ stroke)
ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
chartArea.height

ความสูงของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.left

ระยะห่างระหว่างเส้นขอบด้านซ้ายกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.top

ระยะห่างระหว่างเส้นขอบด้านบนกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.width

ความกว้างของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
is3D

หากเป็น true แสดงแผนภูมิ 3 มิติ

ประเภท: boolean
ค่าเริ่มต้น: false
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legend.position

ตำแหน่งของคำอธิบาย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'bottom' - ใต้แผนภูมิ
  • 'left' - ทางด้านซ้ายของแผนภูมิในกรณีที่แกนด้านซ้ายไม่มีชุดข้อมูลที่เชื่อมโยงอยู่ ดังนั้นหากต้องการให้คำอธิบายทางด้านซ้าย ให้ใช้ตัวเลือก targetAxisIndex: 1
  • 'in' - ภายในแผนภูมิ ตรงมุมซ้ายบน
  • 'none' - ไม่มีการระบุแหล่งที่มา
  • 'right' - ทางด้านขวาของแผนภูมิ ใช้ร่วมกับตัวเลือก vAxes ไม่ได้
  • 'top' - เหนือแผนภูมิ
ประเภท: string
ค่าเริ่มต้น: 'right'
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
pieHole

หากอยู่ระหว่าง 0 ถึง 1 ระบบจะแสดงแผนภูมิโดนัท โดยรูมีรัศมีเท่ากับ number เท่าของรัศมีของแผนภูมิ

ประเภท: number
ค่าเริ่มต้น: 0
pieSliceBorderColor

สีของเส้นขอบของส่วน ใช้ได้เฉพาะเมื่อแผนภูมิเป็นแบบ 2 มิติ

ประเภท: string
ค่าเริ่มต้น: 'white'
pieSliceText

เนื้อหาของข้อความที่แสดงบนส่วน อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'percentage' - เปอร์เซ็นต์ของขนาดส่วนแบ่งจากทั้งหมด
  • 'value' - ค่าเชิงปริมาณของส่วน
  • 'label' - ชื่อของส่วน
  • 'none' - ไม่มีข้อความแสดง
ประเภท: string
ค่าเริ่มต้น: 'percentage'
pieSliceTextStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความของส่วน ออบเจ็กต์มีรูปแบบดังนี้

{color: <string>, fontName: <string>, fontSize: <number>}

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

หากตั้งค่าเป็น true ระบบจะวาดชุดจากขวาไปซ้าย ค่าเริ่มต้นคือวาดจากซ้ายไปขวา

ตัวเลือกนี้ใช้ได้กับแกน discrete major เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
slices.color

สีที่จะใช้สำหรับส่วนนี้

ประเภท: string
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}

ตัวเลือกการกําหนดค่าแผนภูมิกระจาย

ชื่อ
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของพื้นที่ในแผนภูมิเป็นสตริงสี HTML

ประเภท:string
ค่าเริ่มต้น: 'white'
chartArea

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าตําแหน่งและขนาดของพื้นที่แผนภูมิ (ที่วาดแผนภูมิเอง ยกเว้นแกนนอนและลําดับชั้น) ระบบรองรับ 2 รูปแบบ ได้แก่ ตัวเลขหรือตัวเลขตามด้วย % ตัวเลขธรรมดาคือค่าในพิกเซล ส่วนตัวเลขตามด้วย % คือเปอร์เซ็นต์ ตัวอย่าง: chartArea:{left:20,top:0,width:'50%',height:'75%'}

ประเภท: object
ค่าเริ่มต้น: null
chartArea.backgroundColor
สีพื้นหลังของพื้นที่แผนภูมิ เมื่อใช้สตริง สตริงดังกล่าวอาจเป็นสตริงฐาน 16 (เช่น '#fdc') หรือชื่อสีภาษาอังกฤษ เมื่อใช้ออบเจ็กต์ คุณสามารถระบุพร็อพเพอร์ตี้ต่อไปนี้ได้
  • stroke: สีที่ระบุเป็นสตริงฐาน 16 หรือชื่อสีภาษาอังกฤษ
  • strokeWidth: หากระบุไว้ ให้วาดเส้นขอบรอบๆ พื้นที่แผนภูมิที่มีความกว้างที่ระบุ (และด้วยสีของ stroke)
ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
chartArea.height

ความสูงของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.left

ระยะห่างระหว่างเส้นขอบด้านซ้ายกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.top

ระยะห่างระหว่างเส้นขอบด้านบนกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.width

ความกว้างของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
curveType

ควบคุมเส้นโค้งของเส้นเมื่อความกว้างของเส้นไม่ใช่ 0 อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'none' - เส้นตรงที่ไม่มีเส้นโค้ง
  • 'function' - ระบบจะปรับมุมของเส้นให้เรียบ
ประเภท:string
ค่าเริ่มต้น: "none"
hAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบในแนวนอนต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
hAxis.direction

ทิศทางที่ค่าตามแกนแนวนอนเพิ่มขึ้น ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
hAxis.gridlines

ออบเจ็กต์ที่มีพร็อพเพอร์ตี้ในการกําหนดค่าเส้นตารางในแนวนอน โปรดทราบว่าเส้นตารางแกนแนวนอนจะวาดในแนวตั้ง หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.gridlines.color

สีของเส้นตารางแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
hAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
hAxis.logScale

พร็อพเพอร์ตี้ hAxis ที่ทำให้แกนนอนเป็นมาตราส่วนเชิงลําดับเลข (ค่าทั้งหมดต้องเป็นค่าบวก) ตั้งค่าเป็น true สำหรับ "ใช่"

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
hAxis.maxValue

ย้ายค่าสูงสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ด้านขวาในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า x สูงสุดของข้อมูล hAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนนอน ซึ่งคล้ายกับตัวเลือก hAxis.gridlines

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
hAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวนอนภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
hAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 ตอนนี้จำนวนเส้นกริดย่อยจะขึ้นอยู่กับช่วงเวลาระหว่างเส้นกริดหลัก (ดู hAxis.gridlines.interval) และพื้นที่ขั้นต่ำที่ต้องการ (ดู hAxis.minorGridlines.minSpacing) ทั้งหมด

ประเภท: number
ค่าเริ่มต้น: 1
hAxis.minValue

ย้ายค่าต่ำสุดของแกนนอนไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เลื่อนไปทางซ้ายในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า x ขั้นต่ำของข้อมูล hAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.textPosition

ตำแหน่งของข้อความแกนแนวนอนสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
hAxis.textStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความของแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

hAxis พร็อพเพอร์ตี้ที่ระบุชื่อแกนแนวนอน

ประเภท: string
ค่าเริ่มต้น: null
hAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวนอน

ประเภท: object
ค่าเริ่มต้น: null
hAxis.viewWindow.max

ค่าข้อมูลแนวนอนสูงสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.viewWindow.min

ค่าข้อมูลแนวนอนต่ำสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legend.position

ตำแหน่งของคำอธิบาย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'bottom' - ใต้แผนภูมิ
  • 'left' - ทางด้านซ้ายของแผนภูมิในกรณีที่แกนด้านซ้ายไม่มีชุดข้อมูลที่เชื่อมโยงอยู่ ดังนั้นหากต้องการให้คำอธิบายทางด้านซ้าย ให้ใช้ตัวเลือก targetAxisIndex: 1
  • 'in' - ภายในแผนภูมิ ตรงมุมซ้ายบน
  • 'none' - ไม่มีการระบุแหล่งที่มา
  • 'right' - ทางด้านขวาของแผนภูมิ ใช้ร่วมกับตัวเลือก vAxes ไม่ได้
  • 'top'- เหนือแผนภูมิ
ประเภท: string
ค่าเริ่มต้น: 'right'
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
lineWidth

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

ประเภท: number
ค่าเริ่มต้น: 2
pointShape

รูปร่างขององค์ประกอบข้อมูลแต่ละรายการ: 'circle', 'triangle', 'square', 'diamond', 'star' หรือ 'polygon' ดูตัวอย่างได้ใน เอกสารประกอบเกี่ยวกับคะแนน

ประเภท: string
ค่าเริ่มต้น: 'circle'
pointSize

เส้นผ่านศูนย์กลางของจุดที่แสดงเป็นพิกเซล ใช้ 0 เพื่อซ่อนจุดทั้งหมด คุณสามารถลบล้างค่าสำหรับชุดหนังสือแต่ละชุดได้โดยใช้พร็อพเพอร์ตี้ series หากคุณใช้เส้นแนวโน้ม ตัวเลือก pointSize จะส่งผลต่อความกว้างของเส้นแนวโน้ม เว้นแต่คุณจะลบล้างด้วยตัวเลือก trendlines.n.pointsize

ประเภท: number
ค่าเริ่มต้น: 0
ซีรีส์

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

  • color - สีที่จะใช้กับชุดข้อมูลนี้ ระบุสตริงสี HTML ที่ถูกต้อง
  • labelInLegend - คําอธิบายชุดที่จะปรากฏในคําอธิบายแผนภูมิ
  • lineWidth - ลบล้างค่า lineWidth ระดับส่วนกลางสำหรับชุดนี้
  • pointShape - ลบล้างค่า pointShape ระดับส่วนกลางสำหรับชุดนี้
  • pointSize - ลบล้างค่า pointSize ระดับส่วนกลางสำหรับชุดนี้
  • pointsVisible - ลบล้างค่า pointsVisible ระดับส่วนกลางสำหรับชุดนี้
  • visibleInLegend - ค่า boolean โดยที่ true หมายความว่าชุดข้อมูลควรมีรายการคำอธิบายประกอบ และ false หมายความว่าไม่ควรมี ค่าเริ่มต้นคือ true

คุณสามารถระบุอาร์เรย์ของออบเจ็กต์ โดยแต่ละรายการจะมีผลกับชุดหนังสือตามลำดับที่ระบุ หรือจะระบุออบเจ็กต์ที่มีออบเจ็กต์ย่อยแต่ละรายการมีคีย์ตัวเลขที่ระบุชุดหนังสือที่ใช้ก็ได้ ตัวอย่างเช่น การประกาศ 2 รายการต่อไปนี้เหมือนกัน และประกาศชุดที่ 1 เป็นสีดําและไม่มีในคําอธิบายประกอบ และชุดที่ 4 เป็นสีแดงและไม่มีในคําอธิบายประกอบ

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ที่ฝังอยู่
ค่าเริ่มต้น: {}
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ธีม [theme]

ธีมคือชุดค่าตัวเลือกที่กําหนดไว้ล่วงหน้าซึ่งทํางานร่วมกันเพื่อให้ได้ลักษณะการทํางานของแผนภูมิหรือเอฟเฟกต์ภาพที่ต้องการ ปัจจุบันมีธีมเดียวที่ใช้ได้ ดังนี้

  • 'maximized' - ขยายพื้นที่ของแผนภูมิให้ใหญ่ที่สุด และวาดคําอธิบายแผนภูมิและป้ายกำกับทั้งหมดภายในพื้นที่แผนภูมิ
ประเภท: string
ค่าเริ่มต้น: null
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
treatLabelsAsText

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์นั้นเป็นคอลัมน์ข้อความ

ประเภท: boolean
เส้นแนวโน้ม

แสดงเส้นแนวโน้ม ในแผนภูมิที่รองรับ โดยค่าเริ่มต้น ระบบจะใช้เส้นแนวโน้ม linear แต่คุณปรับแต่งได้ด้วยตัวเลือก trendlines.n.type

เส้นแนวโน้มจะระบุตามอนุกรม ดังนั้นตัวเลือกของคุณจึงมักจะมีลักษณะดังนี้

var options = {
  trendlines: {
    0: {
      type: 'linear',
      color: 'green',
      lineWidth: 3,
      opacity: 0.3,
      visibleInLegend: true
    }
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
trendlines.n.color

สีของ เส้นแนวโน้ม ซึ่งแสดงเป็นชื่อสีภาษาอังกฤษหรือสตริงฐาน 16

ประเภท: string
ค่าเริ่มต้น: สีชุดเริ่มต้น
trendlines.n.degree

สำหรับ เส้นแนวโน้ม ของ type: 'polynomial' ดีกรีของพหุนาม (2 สำหรับแบบ 2 ตัวแปร 3 สำหรับแบบ 3 ตัวแปร และอื่นๆ)

ประเภท: number
ค่าเริ่มต้น: 3
trendlines.n.labelInLegend

หากตั้งค่าไว้ เส้นแนวโน้ม จะปรากฏในคำอธิบายเป็นสตริงนี้

ประเภท: string
ค่าเริ่มต้น: null
trendlines.n.lineWidth

ความกว้างของเส้นของเส้นแนวโน้ม เป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: 2
trendlines.n.type

เส้นแนวโน้ม เป็น 'linear' (ค่าเริ่มต้น), 'exponential' หรือ 'polynomial'

ประเภท: string
ค่าเริ่มต้น: linear
trendlines.n.visibleInLegend

สมการของเส้นแนวโน้มจะปรากฏในคำอธิบายหรือไม่ ซึ่งจะปรากฏในเคล็ดลับเครื่องมือของเส้นแนวโน้ม

ประเภท: boolean
ค่าเริ่มต้น: false
useFirstColumnAsDomain

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์เป็นโดเมน

ประเภท: boolean
vAxes

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

หากต้องการระบุแผนภูมิที่มีแกนแนวตั้งหลายแกน ให้กําหนดแกนใหม่โดยใช้ series.targetAxisIndex ก่อน แล้วกําหนดค่าแกนโดยใช้ vAxes ตัวอย่างต่อไปนี้กำหนดชุดที่ 2 ให้กับแกนขวา และระบุชื่อและสไตล์ข้อความที่กำหนดเอง

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

พร็อพเพอร์ตี้นี้อาจเป็นออบเจ็กต์หรืออาร์เรย์ก็ได้ โดยออบเจ็กต์คือคอลเล็กชันของออบเจ็กต์ ซึ่งแต่ละรายการจะมีป้ายกำกับตัวเลขที่ระบุแกนที่กำหนด ซึ่งก็คือรูปแบบที่แสดงด้านบน ส่วนอาร์เรย์คืออาร์เรย์ของออบเจ็กต์ 1 รายการต่อแกน ตัวอย่างเช่น รูปแบบอาร์เรย์ต่อไปนี้จะเหมือนกับออบเจ็กต์ vAxis ที่แสดงด้านบน

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ย่อย
ค่าเริ่มต้น: null
vAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบแกนแนวตั้งต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
ประเภท: object
ค่าเริ่มต้น: null
vAxis.direction

ทิศทางที่ค่าตามแกนแนวตั้งเพิ่มขึ้น โดยค่าเริ่มต้น ค่าต่ำจะอยู่ที่ด้านล่างของแผนภูมิ ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
vAxis.gridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นตารางในแนวตั้ง โปรดทราบว่าเส้นตารางแกนแนวตั้งจะวาดในแนวนอน หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
vAxis.gridlines.color

สีของเส้นตารางแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
vAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
vAxis.logScale

หากเป็น true จะทำให้แกนแนวตั้งเป็นมาตราส่วนเชิงลอนจิทูด หมายเหตุ: ค่าทั้งหมดต้องเป็นค่าบวก

ประเภท: boolean
ค่าเริ่มต้น: false
vAxis.maxValue

ย้ายค่าสูงสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เพิ่มขึ้นในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า y สูงสุดของข้อมูล vAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนแนวตั้ง ซึ่งคล้ายกับตัวเลือก vAxis.gridlines

ประเภท: object
ค่าเริ่มต้น: null
vAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
vAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 จำนวนเส้นกริดย่อยจะขึ้นอยู่กับระยะห่างระหว่างเส้นกริดหลักและพื้นที่ขั้นต่ำที่ต้องการ

ประเภท: number
ค่าเริ่มต้น: 1
vAxis.minValue

ย้ายค่าต่ำสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ลดลงในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า y ขั้นต่ำของข้อมูล vAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: null
vAxis.textPosition

ตำแหน่งของข้อความแกนแนวตั้งสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
vAxis.textStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความของแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

ระบุชื่อแกนแนวตั้ง

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
vAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวตั้ง

ประเภท: object
ค่าเริ่มต้น: null
vAxis.viewWindow.max

ค่าข้อมูลแนวตั้งสูงสุดที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.viewWindow.min

ค่าข้อมูลแนวตั้งขั้นต่ำที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ

ตัวเลือกการกําหนดค่าแผนภูมิพื้นที่แบบขั้นบันได

ชื่อ
areaOpacity

ความทึบแสงเริ่มต้นของพื้นที่สีใต้ชุดแผนภูมิพื้นที่ ซึ่ง 0.0 หมายถึงโปร่งแสงทั้งหมด และ 1.0 หมายถึงทึบแสงสนิท หากต้องการระบุระดับความทึบของซีรีส์แต่ละรายการ ให้ตั้งค่า areaOpacity ในพร็อพเพอร์ตี้ series

ประเภท: number, 0.0- 1.0
ค่าเริ่มต้น: 0.3
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
backgroundColor.fill

สีของส่วนที่เป็นพื้นในแผนภูมิในรูปแบบสตริงสี HTML

ประเภท: string
ค่าเริ่มต้น: 'white'
chartArea

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าตําแหน่งและขนาดของพื้นที่แผนภูมิ (ที่วาดแผนภูมิเอง ยกเว้นแกนนอนและลําดับชั้น) ระบบรองรับ 2 รูปแบบ ได้แก่ ตัวเลขหรือตัวเลขตามด้วย % ตัวเลขธรรมดาคือค่าในพิกเซล ส่วนตัวเลขตามด้วย % คือเปอร์เซ็นต์ ตัวอย่าง: chartArea:{left:20,top:0,width:'50%',height:'75%'}

ประเภท: object
ค่าเริ่มต้น: null
chartArea.backgroundColor
สีพื้นหลังของพื้นที่แผนภูมิ เมื่อใช้สตริง สตริงดังกล่าวอาจเป็นสตริงฐาน 16 (เช่น '#fdc') หรือชื่อสีภาษาอังกฤษ เมื่อใช้ออบเจ็กต์ คุณสามารถระบุพร็อพเพอร์ตี้ต่อไปนี้ได้
  • stroke: สีที่ระบุเป็นสตริงฐาน 16 หรือชื่อสีภาษาอังกฤษ
  • strokeWidth: หากระบุไว้ ให้วาดเส้นขอบรอบๆ พื้นที่แผนภูมิที่มีความกว้างที่ระบุ (และด้วยสีของ stroke)
ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
chartArea.height

ความสูงของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.left

ระยะห่างระหว่างเส้นขอบด้านซ้ายกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.top

ระยะห่างระหว่างเส้นขอบด้านบนกับแผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
chartArea.width

ความกว้างของพื้นที่แผนภูมิ

ประเภท: number หรือ string
ค่าเริ่มต้น: อัตโนมัติ
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
hAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบในแนวนอนต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
ประเภท: object
ค่าเริ่มต้น: null
hAxis.direction

ทิศทางที่ค่าตามแกนแนวนอนเพิ่มขึ้น ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
hAxis.textPosition

ตำแหน่งของข้อความแกนแนวนอนสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
hAxis.textStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความของแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

hAxis พร็อพเพอร์ตี้ที่ระบุชื่อแกนแนวนอน

ประเภท: string
ค่าเริ่มต้น: null
hAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวนอน ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวนอน

ประเภท: object
ค่าเริ่มต้น: null
hAxis.viewWindow.max

ค่าข้อมูลแนวนอนสูงสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
hAxis.viewWindow.min

ค่าข้อมูลแนวนอนต่ำสุดที่จะแสดงผล

ละเว้นเมื่อ hAxis.viewWindowMode เป็น 'pretty' หรือ 'maximized'

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
isStacked

หากตั้งค่าเป็น true ระบบจะซ้อนองค์ประกอบของทุกชุดค่ายที่ค่าโดเมนแต่ละค่า หมายเหตุ: ในแผนภูมิคอลัมน์ พื้นที่ และ SteppedArea Google Charts จะกลับลําดับของรายการในแผนภูมิเพื่อให้สอดคล้องกับการซ้อนขององค์ประกอบชุดค่างําได้ดีขึ้น (เช่น ชุดที่ 0 จะเป็นรายการในแผนภูมิที่ต่ำที่สุด) กฎนี้ ไม่มีผล กับแผนภูมิแท่ง

ตัวเลือก isStacked ยังรองรับการซ้อน 100% ด้วย โดยระบบจะปรับขนาดกององค์ประกอบที่ค่าโดเมนแต่ละค่าใหม่เพื่อให้รวมกันได้ 100%

ตัวเลือกสำหรับ isStacked มีดังนี้

  • false — องค์ประกอบจะไม่ซ้อนกัน ประเภทการทำงานนี้เป็นค่าเริ่มต้น
  • true — ซ้อนองค์ประกอบของชุดข้อมูลทั้งหมดที่ค่าโดเมนแต่ละค่า
  • 'percent' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 100% โดยค่าขององค์ประกอบแต่ละรายการจะคํานวณเป็นเปอร์เซ็นต์ของ 100%
  • 'relative' — จัดวางองค์ประกอบของชุดข้อมูลทั้งหมดตามค่าโดเมนแต่ละค่า และปรับขนาดใหม่เพื่อให้ผลรวมเท่ากับ 1 โดยค่าของแต่ละองค์ประกอบจะคํานวณเป็นเศษส่วนของ 1
  • 'absolute' — ทำงานเหมือนกับ isStacked: true

สําหรับการซ้อน 100% ค่าที่คำนวณแล้วของแต่ละองค์ประกอบจะปรากฏในเคล็ดลับเครื่องมือหลังค่าจริง

ค่าเริ่มต้นของแกนเป้าหมายจะเป็นค่าขีดตามสเกล 0-1 แบบสัมพัทธ์เป็นเศษส่วนของ 1 สำหรับ 'relative' และ 0-100% สำหรับ 'percent' (หมายเหตุ: เมื่อใช้ตัวเลือก 'percent' ค่าแกน/ขีดจะแสดงเป็นเปอร์เซ็นต์ แต่ค่าจริงคือค่าสเกล 0-1 แบบสัมพัทธ์ เนื่องจากเครื่องหมายบนแกนเปอร์เซ็นต์เป็นผลมาจากการใช้รูปแบบ "#.##%" กับค่าสเกล 0-1 แบบสัมพัทธ์ เมื่อใช้ isStacked: 'percent' โปรดตรวจสอบว่าได้ระบุเครื่องหมาย/เส้นตารางโดยใช้ค่าสเกลแบบสัมพัทธ์ 0-1) คุณปรับแต่งเส้นตาราง/ค่าการแบ่งแท่งและการจัดรูปแบบได้โดยใช้ตัวเลือก hAxis/vAxis ที่เหมาะสม

การซ้อน 100% รองรับเฉพาะค่าข้อมูลประเภท number เท่านั้น และต้องมีค่าฐานเป็น 0

ประเภท: boolean/ string
ค่าเริ่มต้น: false
คำอธิบาย

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าแง่มุมต่างๆ ของคําอธิบาย หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนโค้ดแบบออบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
ประเภท: object
ค่าเริ่มต้น: null
legend.position

ตำแหน่งของคำอธิบาย อาจเป็นค่าใดค่าหนึ่งต่อไปนี้

  • 'bottom' - ใต้แผนภูมิ
  • 'left' - ทางด้านซ้ายของแผนภูมิในกรณีที่แกนด้านซ้ายไม่มีชุดข้อมูลที่เชื่อมโยงอยู่ ดังนั้นหากต้องการให้คำอธิบายทางด้านซ้าย ให้ใช้ตัวเลือก targetAxisIndex: 1
  • 'in' - ภายในแผนภูมิ ตรงมุมซ้ายบน
  • 'none' - ไม่มีการระบุแหล่งที่มา
  • 'right' - ทางด้านขวาของแผนภูมิ ใช้ร่วมกับตัวเลือก vAxes ไม่ได้
  • 'top' - เหนือแผนภูมิ
ประเภท: string
ค่าเริ่มต้น: 'right'
legendTextStyle

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

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

หากตั้งค่าเป็น true ระบบจะวาดชุดจากขวาไปซ้าย ค่าเริ่มต้นคือวาดจากซ้ายไปขวา

ตัวเลือกนี้ใช้ได้กับแกน discrete major เท่านั้น

ประเภท: boolean
ค่าเริ่มต้น: false
ซีรีส์

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

  • areaOpacity - ลบล้าง areaOpacity ระดับส่วนกลางสำหรับชุดนี้
  • color - สีที่จะใช้กับชุดข้อมูลนี้ ระบุสตริงสี HTML ที่ถูกต้อง
  • type - ประเภทเครื่องหมายของชุดข้อมูลนี้ ค่าที่ใช้ได้คือ "line", "area", 'bars' และ "steppedArea" โปรดทราบว่าแถบคือแถบแนวตั้ง (คอลัมน์) ค่าเริ่มต้นจะระบุโดยตัวเลือก seriesType ของแผนภูมิ
  • labelInLegend - คําอธิบายชุดที่จะปรากฏในคําอธิบายแผนภูมิ
  • lineDashStyle - ลบล้างค่า lineDashStyle ระดับส่วนกลางสำหรับชุดนี้
  • targetAxisIndex - แกนที่จะกำหนดชุดข้อมูลนี้ โดยที่ 0 คือแกนเริ่มต้น และ 1 คือแกนตรงข้าม ค่าเริ่มต้นคือ 0 ให้ตั้งค่าเป็น 1 เพื่อกําหนดแผนภูมิที่แสดงผลอนุกรมต่างๆ บนแกนต่างๆ คุณต้องจัดสรรชุดค่าอย่างน้อย 1 ชุดให้กับแกนเริ่มต้น คุณกําหนดมาตราส่วนที่แตกต่างกันสําหรับแกนต่างๆ ได้
  • visibleInLegend - ค่า boolean โดยที่ true หมายความว่าชุดข้อมูลควรมีรายการคำอธิบายประกอบ และ false หมายความว่าไม่ควรมี ค่าเริ่มต้นคือ true

คุณสามารถระบุอาร์เรย์ของออบเจ็กต์ โดยแต่ละรายการจะมีผลกับชุดค่าตามลําดับที่ระบุ หรือจะระบุออบเจ็กต์ที่มีออบเจ็กต์ย่อยแต่ละรายการมีคีย์ตัวเลขที่ระบุชุดค่าที่จะใช้ก็ได้ ตัวอย่างเช่น การประกาศ 2 รายการต่อไปนี้เหมือนกัน และประกาศชุดค่าแรกเป็นสีดําและไม่มีในลําดับ และกําหนดชุดค่าที่ 4 เป็นสีแดงและไม่มีในลําดับ

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ที่ฝังอยู่
ค่าเริ่มต้น: {}
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ธีม [theme]

ธีมคือชุดค่าตัวเลือกที่กําหนดไว้ล่วงหน้าซึ่งทํางานร่วมกันเพื่อให้ได้ลักษณะการทํางานของแผนภูมิหรือเอฟเฟกต์ภาพที่ต้องการ ปัจจุบันมีธีมเดียวที่ใช้ได้ ดังนี้

  • 'maximized' - ขยายพื้นที่ของแผนภูมิให้ใหญ่ที่สุด และวาดคําอธิบายแผนภูมิและป้ายกำกับทั้งหมดภายในพื้นที่แผนภูมิ
ประเภท: string
ค่าเริ่มต้น: null
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
treatLabelsAsText

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์นั้นเป็นคอลัมน์ข้อความ

ประเภท: boolean
useFirstColumnAsDomain

หากตั้งค่าเป็น true แผนภูมิจะถือว่าคอลัมน์เป็นโดเมน

ประเภท: boolean
vAxes

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

หากต้องการระบุแผนภูมิที่มีแกนแนวตั้งหลายแกน ให้กําหนดแกนใหม่โดยใช้ series.targetAxisIndex ก่อน แล้วกําหนดค่าแกนโดยใช้ vAxes ตัวอย่างต่อไปนี้กำหนดชุดที่ 2 ให้กับแกนขวา และระบุชื่อและสไตล์ข้อความที่กำหนดเอง

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

พร็อพเพอร์ตี้นี้อาจเป็นออบเจ็กต์หรืออาร์เรย์ก็ได้ โดยออบเจ็กต์คือคอลเล็กชันของออบเจ็กต์ ซึ่งแต่ละรายการจะมีป้ายกำกับตัวเลขที่ระบุแกนที่กำหนด ซึ่งก็คือรูปแบบที่แสดงด้านบน ส่วนอาร์เรย์คืออาร์เรย์ของออบเจ็กต์ 1 รายการต่อแกน ตัวอย่างเช่น รูปแบบอาร์เรย์ต่อไปนี้จะเหมือนกับออบเจ็กต์ vAxis ที่แสดงด้านบน

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
ประเภท: อาร์เรย์ของออบเจ็กต์หรือออบเจ็กต์ที่มีออบเจ็กต์ย่อย
ค่าเริ่มต้น: null
vAxis

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าองค์ประกอบแกนแนวตั้งต่างๆ หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
ประเภท: object
ค่าเริ่มต้น: null
vAxis.direction

ทิศทางที่ค่าตามแกนแนวตั้งเพิ่มขึ้น โดยค่าเริ่มต้น ค่าต่ำจะอยู่ที่ด้านล่างของแผนภูมิ ระบุ -1 เพื่อกลับลําดับของค่า

ประเภท: 1 หรือ -1
ค่าเริ่มต้น: 1
vAxis.gridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นตารางในแนวตั้ง โปรดทราบว่าเส้นตารางแกนแนวตั้งจะวาดในแนวนอน หากต้องการระบุพร็อพเพอร์ตี้ของออบเจ็กต์นี้ คุณสามารถใช้การเขียนอ็อบเจ็กต์ลิเทอรัลดังที่แสดงที่นี่

{color: '#333', minSpacing: 20}

ตัวเลือกนี้ใช้ได้กับแกน continuous เท่านั้น

ประเภท: object
ค่าเริ่มต้น: null
vAxis.gridlines.color

สีของเส้นตารางแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: '#CCC'
vAxis.gridlines.count

จํานวนเส้นกริดแนวนอนโดยประมาณภายในพื้นที่แผนภูมิ หากคุณระบุจำนวนบวกสำหรับ gridlines.count ระบบจะใช้ค่านี้เพื่อคํานวณ minSpacing ระหว่างเส้นตารางกริด คุณสามารถระบุค่า 1 เพื่อวาดเส้นตารางเพียงเส้นเดียว หรือ 0 เพื่อไม่วาดเส้นตาราง ระบุ -1 ซึ่งเป็นค่าเริ่มต้น เพื่อคํานวณจํานวนเส้นกริดโดยอัตโนมัติตามตัวเลือกอื่นๆ

ประเภท: number
ค่าเริ่มต้น: -1
vAxis.logScale

หากเป็น true จะทำให้แกนแนวตั้งเป็นมาตราส่วนเชิงลอนจิทูด หมายเหตุ: ค่าทั้งหมดต้องเป็นค่าบวก

ประเภท: boolean
ค่าเริ่มต้น: false
vAxis.maxValue

ย้ายค่าสูงสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่เพิ่มขึ้นในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่น้อยกว่าค่า y สูงสุดของข้อมูล vAxis.viewWindow.max ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.minorGridlines

ออบเจ็กต์ที่มีสมาชิกเพื่อกําหนดค่าเส้นกริดย่อยบนแกนแนวตั้ง ซึ่งคล้ายกับตัวเลือก vAxis.gridlines

ประเภท: object
ค่าเริ่มต้น: null
vAxis.minorGridlines.color

สีของเส้นตารางย่อยแนวตั้งภายในพื้นที่แผนภูมิ ระบุสตริงสี HTML ที่ถูกต้อง

ประเภท: string
ค่าเริ่มต้น: การผสมผสานเส้นตารางและสีพื้นหลัง
vAxis.minorGridlines.count

ตัวเลือก minorGridlines.count เลิกใช้งานแล้วส่วนใหญ่ ยกเว้นการปิดใช้เส้นกริดย่อยโดยการตั้งค่าจํานวนเป็น 0 จำนวนเส้นกริดย่อยจะขึ้นอยู่กับระยะห่างระหว่างเส้นกริดหลักและพื้นที่ขั้นต่ำที่ต้องการ

ประเภท: number
ค่าเริ่มต้น: 1
vAxis.minValue

ย้ายค่าต่ำสุดของแกนแนวตั้งไปยังค่าที่ระบุ ซึ่งจะเป็นค่าที่ลดลงในแผนภูมิส่วนใหญ่ ระบบจะไม่สนใจหากตั้งค่านี้เป็นค่าที่มากกว่าค่า y ขั้นต่ำของข้อมูล vAxis.viewWindow.min ลบล้างพร็อพเพอร์ตี้นี้

ประเภท: number
ค่าเริ่มต้น: null
vAxis.textPosition

ตำแหน่งของข้อความแกนแนวตั้งสัมพันธ์กับพื้นที่แผนภูมิ ค่าที่รองรับ: 'out', 'in', 'none'

ประเภท: string
ค่าเริ่มต้น: 'out'
vAxis.textStyle

ออบเจ็กต์ที่ระบุสไตล์ข้อความของแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

ระบุชื่อแกนแนวตั้ง

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
vAxis.titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อแกนแนวตั้ง ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

ระบุช่วงการครอบตัดของแกนแนวตั้ง

ประเภท: object
ค่าเริ่มต้น: null
vAxis.viewWindow.max

ค่าข้อมูลแนวตั้งสูงสุดที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
vAxis.viewWindow.min

ค่าข้อมูลแนวตั้งขั้นต่ำที่จะแสดงผล

ระบบจะไม่สนใจเมื่อ vAxis.viewWindowMode เป็น "pretty" หรือ "maximized"

ประเภท: number
ค่าเริ่มต้น: อัตโนมัติ
ความกว้าง

ความกว้างของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความกว้างขององค์ประกอบที่บรรจุ

ตัวเลือกการกำหนดค่าแผนภูมิตาราง

ชื่อ
alternatingRowStyle

กำหนดว่าจะกำหนดสไตล์สีสลับให้กับแถวคี่และแถวคู่หรือไม่

ประเภท: boolean
ค่าเริ่มต้น: true
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
เพจ

การเปิดใช้การแบ่งหน้าข้อมูลหรือไม่และวิธีเปิดใช้ เลือกค่า string ใดค่าหนึ่งต่อไปนี้

  • 'enable' - ตารางจะมีปุ่มหน้าถัดไปและหน้าก่อนหน้า การคลิกปุ่มเหล่านี้จะดำเนินการแบ่งหน้าและเปลี่ยนหน้าที่แสดง คุณอาจต้องตั้งค่าตัวเลือก pageSize ด้วย
  • 'event' - ตารางจะมีปุ่มหน้าถัดไปและหน้าก่อนหน้า แต่การคลิกปุ่มดังกล่าวจะทริกเกอร์เหตุการณ์ 'page' และไม่เปลี่ยนหน้าที่แสดง คุณควรใช้ตัวเลือกนี้เมื่อโค้ดใช้ตรรกะการเลื่อนหน้าเว็บของตัวเอง ดูตัวอย่างวิธีจัดการเหตุการณ์การแบ่งหน้าด้วยตนเองได้ที่ตัวอย่าง TableQueryWrapper
  • 'disable' - [ค่าเริ่มต้น] ไม่รองรับการแบ่งหน้า
  • ประเภท: string
    ค่าเริ่มต้น: 'disable'
pageSize

จํานวนแถวในแต่ละหน้าเมื่อเปิดใช้การแบ่งหน้าด้วยตัวเลือกหน้า

ประเภท: number
ค่าเริ่มต้น: 10
showRowNumber

หากตั้งค่าเป็น true ระบบจะแสดงหมายเลขแถวเป็นคอลัมน์แรกของตาราง

ประเภท: boolean
ค่าเริ่มต้น: false
จัดเรียง

เงื่อนไขและวิธีจัดเรียงคอลัมน์เมื่อผู้ใช้คลิกส่วนหัวของคอลัมน์ หากเปิดใช้การจัดเรียง ให้ลองตั้งค่าพร็อพเพอร์ตี้ sortAscending และ sortColumn ด้วย เลือกค่า string ใดค่าหนึ่งต่อไปนี้

  • 'enable' - [ค่าเริ่มต้น] ผู้ใช้สามารถคลิกส่วนหัวของคอลัมน์เพื่อจัดเรียงตามคอลัมน์ที่คลิก เมื่อผู้ใช้คลิกส่วนหัวของคอลัมน์ ระบบจะจัดเรียงแถวโดยอัตโนมัติ และ'sort'เรียกเหตุการณ์ให้แสดง
  • 'event' - เมื่อผู้ใช้คลิกส่วนหัวของคอลัมน์ ระบบจะทริกเกอร์เหตุการณ์ 'sort' แต่จะไม่จัดเรียงแถวโดยอัตโนมัติ คุณควรใช้ตัวเลือกนี้เมื่อหน้าเว็บใช้การจัดเรียงของตนเอง ดูตัวอย่างวิธีจัดการเหตุการณ์การจัดเรียงด้วยตนเองได้ที่ตัวอย่าง TableQueryWrapper
  • 'disable'- การคลิกส่วนหัวคอลัมน์จะไม่มีผล
ประเภท: string
ค่าเริ่มต้น: 'enable'
sortAscending

ลำดับการจัดเรียงคอลัมน์การจัดเรียงเริ่มต้น True สำหรับจากน้อยไปมาก false สำหรับจากมากไปน้อย ละเว้นหากไม่ได้ระบุ sortColumn

ประเภท: boolean
ค่าเริ่มต้น: true
sortColumn

ดัชนีของคอลัมน์ในตารางข้อมูลซึ่งใช้จัดเรียงตารางในตอนแรก คอลัมน์จะมีลูกศรเล็กๆ ที่ระบุลําดับการจัดเรียง

ประเภท: number
ค่าเริ่มต้น: -1
ความกว้าง

ความกว้างของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความกว้างขององค์ประกอบที่บรรจุ

ตัวเลือกการกําหนดค่าไทม์ไลน์

ชื่อ
backgroundColor

สีพื้นหลังสําหรับพื้นที่หลักของแผนภูมิ อาจเป็นสตริงสี HTML ธรรมดา เช่น 'red' หรือ '#00cc00' หรือออบเจ็กต์ที่มีพร็อพเพอร์ตี้ต่อไปนี้

ประเภท: string หรือ object
ค่าเริ่มต้น: 'white'
สี

สีที่จะใช้สำหรับองค์ประกอบของแผนภูมิ อาร์เรย์สตริงที่แต่ละองค์ประกอบเป็นสตริงสี HTML เช่น colors:['red','#004411']

ประเภท: อาร์เรย์สตริง
ค่าเริ่มต้น: สีเริ่มต้น
ส่วนสูง

ความสูงของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความสูงขององค์ประกอบที่บรรจุ
ความกว้าง

ความกว้างของแผนภูมิเป็นพิกเซล

ประเภท: number
ค่าเริ่มต้น: ความกว้างขององค์ประกอบที่บรรจุ

ตัวเลือกการกําหนดค่า Tree Map

ชื่อ
headerColor

สีของส่วนหัวสำหรับแต่ละโหนด ระบุค่าสี HTML

ประเภท: string
ค่าเริ่มต้น: #988f86
maxColor

สีของสี่เหลี่ยมผืนผ้าที่มีค่าในคอลัมน์ 3 เป็น maxColorValue ระบุค่าสี HTML

ประเภท: string
ค่าเริ่มต้น: #00dd00
maxDepth

จำนวนระดับโหนดสูงสุดที่จะแสดงในมุมมองปัจจุบัน ระบบจะผสานระดับต่างๆ ลงในระนาบปัจจุบัน หากแผนภูมิมีมากกว่า 3 ระดับ คุณต้องเลื่อนขึ้นหรือลงเพื่อดู นอกจากนี้ คุณยังจะเห็นระดับ maxPostDepth ด้านล่างนี้ในรูปแบบสี่เหลี่ยมผืนผ้าที่แรเงาภายในโหนดเหล่านี้

ประเภท: number
ค่าเริ่มต้น: 1
maxPostDepth

จำนวนระดับโหนดนอกเหนือจาก maxDepth ที่แสดงในลักษณะ "บอกใบ้" โหนดที่บอกใบ้จะแสดงเป็นสี่เหลี่ยมผืนผ้าที่แรเงาภายในโหนดที่อยู่ภายในขีดจำกัด maxDepth

ประเภท: number
ค่าเริ่มต้น: 0
midColor

สีของสี่เหลี่ยมผืนผ้าที่มีค่าในคอลัมน์ 3 อยู่ตรงกลางระหว่าง maxColorValue กับ minColorValue ระบุค่าสี HTML

ประเภท: string
ค่าเริ่มต้น: #000000
minColor

สีของสี่เหลี่ยมผืนผ้าที่มีค่าในคอลัมน์ 3 เป็น minColorValue ระบุค่าสี HTML

ประเภท: string
ค่าเริ่มต้น: #dd0000
noColor

สีที่จะใช้สำหรับสี่เหลี่ยมผืนผ้าเมื่อโหนดไม่มีค่าสำหรับคอลัมน์ 3 และโหนดนั้นเป็นใบ (หรือมีเฉพาะใบ) ระบุค่าสี HTML

ประเภท: string
ค่าเริ่มต้น: #000000
คำบรรยาย

ข้อความที่จะแสดงใต้ชื่อแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
subtitleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
textStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ สีอาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดู fontName และ fontSize ด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
title

ข้อความที่จะแสดงเหนือแผนภูมิ

ประเภท: string
ค่าเริ่มต้น: ไม่มีชื่อ
titleTextStyle

ออบเจ็กต์ที่ระบุรูปแบบข้อความชื่อ ออบเจ็กต์มีรูปแบบดังนี้

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color อาจเป็นสตริงสี HTML ใดก็ได้ เช่น 'red' หรือ '#00cc00' โปรดดูfontNameและfontSizeด้วย

ประเภท: object
ค่าเริ่มต้น: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}