แผนภูมิคำอธิบายประกอบ

  1. ภาพรวม
  2. ตัวอย่าง
  3. กำลังโหลด
  4. รูปแบบข้อมูล
  5. ตัวเลือกการกำหนดค่า
  6. เมธอด
  7. เหตุการณ์
  8. นโยบายข้อมูล
  9. Notes

ภาพรวม

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

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

ตัวอย่าง

 
<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type='text/javascript'>
      google.charts.load('current', {'packages':['annotationchart']});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('date', 'Date');
        data.addColumn('number', 'Kepler-22b mission');
        data.addColumn('string', 'Kepler title');
        data.addColumn('string', 'Kepler text');
        data.addColumn('number', 'Gliese 163 mission');
        data.addColumn('string', 'Gliese title');
        data.addColumn('string', 'Gliese text');
        data.addRows([
          [new Date(2314, 2, 15), 12400, undefined, undefined,
                                  10645, undefined, undefined],
          [new Date(2314, 2, 16), 24045, 'Lalibertines', 'First encounter',
                                  12374, undefined, undefined],
          [new Date(2314, 2, 17), 35022, 'Lalibertines', 'They are very tall',
                                  15766, 'Gallantors', 'First Encounter'],
          [new Date(2314, 2, 18), 12284, 'Lalibertines', 'Attack on our crew!',
                                  34334, 'Gallantors', 'Statement of shared principles'],
          [new Date(2314, 2, 19), 8476, 'Lalibertines', 'Heavy casualties',
                                  66467, 'Gallantors', 'Mysteries revealed'],
          [new Date(2314, 2, 20), 0, 'Lalibertines', 'All crew lost',
                                  79463, 'Gallantors', 'Omniscience achieved']
        ]);

        var chart = new google.visualization.AnnotationChart(document.getElementById('chart_div'));

        var options = {
          displayAnnotations: true
        };

        chart.draw(data, options);
      }
    </script>
  </head>

  <body>
    <div id='chart_div' style='width: 900px; height: 600px;'></div>
  </body>
</html>

กำลังโหลด

ชื่อแพ็กเกจ google.charts.load คือ "annotationchart"

  google.charts.load("current", {packages: ['annotationchart']});

ชื่อคลาสของการแสดงภาพคือ google.visualization.AnnotationChart

  var visualization = new google.visualization.AnnotationChart(container);

รูปแบบข้อมูล

คุณสามารถแสดงเส้นบนแผนภูมิได้อย่างน้อย 1 เส้น แต่ละแถวจะแสดงตำแหน่ง X ในแผนภูมิ ซึ่งก็คือเวลาที่เจาะจง แต่ละบรรทัดจะอธิบายด้วยชุดคอลัมน์ 1-3 คอลัมน์

  • คอลัมน์แรกเป็นประเภท date หรือ datetime และระบุค่า X ของจุดบนแผนภูมิ หากคอลัมน์นี้เป็นประเภท date (ไม่ใช่ datetime) เวลาที่ความละเอียดน้อยที่สุดบนแกน X จะเป็น 1 วัน
  • จากนั้นข้อมูลแต่ละบรรทัดจะมีการอธิบายด้วยชุดคอลัมน์เพิ่มเติม 1-3 คอลัมน์ ตามที่อธิบายไว้ที่นี่
    • ค่า Y - [ต้องระบุ, ตัวเลข] คอลัมน์แรกในแต่ละชุดจะอธิบายค่าของบรรทัด ณ เวลาที่เกี่ยวข้องจากคอลัมน์แรก ป้ายกำกับคอลัมน์จะแสดงเป็นชื่อของเส้นในแผนภูมิ
    • ชื่อคำอธิบายประกอบ - [ไม่บังคับ สตริง] หากคอลัมน์สตริงตามหลังคอลัมน์ค่า และตัวเลือก displayAnnotations เป็นจริง คอลัมน์นี้จะมีชื่อย่อที่อธิบายจุดนี้ ตัวอย่างเช่น หากเส้นนี้แสดงอุณหภูมิในบราซิล และจุดนี้เป็นตัวเลขที่สูงมาก ชื่ออาจเป็น "วันที่ร้อนที่สุดตามบันทึก"
    • ข้อความคำอธิบายประกอบ - [สตริงตัวเลือก] หากมีคอลัมน์สตริงที่ 2 สำหรับชุดนี้ ระบบจะใช้ค่าเซลล์เป็นข้อความอธิบายเพิ่มเติมสำหรับจุดนี้ คุณต้องตั้งค่าตัวเลือก displayAnnotations เป็น "จริง" เพื่อใช้คอลัมน์นี้ คุณใช้แท็ก HTML ได้หากคุณตั้งค่า allowHtml เป็น true โดยไม่มีขีดจำกัดขนาด แต่โปรดทราบว่ารายการที่ยาวเกินไปอาจล้นส่วนการแสดงผล คุณไม่จำเป็นต้องมีคอลัมน์นี้แม้ว่าคุณจะมีคอลัมน์ชื่อคำอธิบายประกอบสำหรับจุดนี้ก็ตาม แผนภูมิจะไม่ใช้ป้ายกำกับคอลัมน์ ตัวอย่างเช่น หากวันที่นี้เป็นวันที่อากาศร้อนที่สุดตามสถิติ คุณอาจพูดว่า "วันที่ที่ใกล้ที่สุด อากาศเย็นขึ้น 10 องศา"

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

ชื่อ
allowHtml

หากตั้งค่าเป็น "จริง" ข้อความคำอธิบายประกอบที่มีแท็ก HTML จะแสดงผลเป็น HTML

ประเภท: บูลีน
ค่าเริ่มต้น: เท็จ
allValuesSuffix

คำต่อท้ายที่จะเพิ่มให้กับค่าทั้งหมดในคำอธิบาย และทำเครื่องหมายในป้ายกำกับในแกนแนวตั้ง

ประเภท: สตริง
ค่าเริ่มต้น: ไม่มี
annotationsWidth

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

ประเภท: ตัวเลข
ค่าเริ่มต้น: 25
สี

สีที่จะใช้กับเส้นในแผนภูมิและป้ายกำกับ อาร์เรย์ของสตริง องค์ประกอบแต่ละรายการคือสตริงในรูปแบบสี HTML ที่ถูกต้อง เช่น "สีแดง" หรือ "#00cc00"

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

รูปแบบที่ใช้แสดงข้อมูลวันที่ที่มุมขวาบน รูปแบบของช่องนี้จะเป็นไปตามที่ระบุโดยคลาส java SimpleDateFormat

ประเภท: สตริง
ค่าเริ่มต้น: "dd MMMM yyyy" หรือ "HH:mm MMMM dd, yyyy" ขึ้นอยู่กับประเภทของคอลัมน์แรก (วันที่ หรือวันที่และเวลาตามลำดับ)
displayAnnotations

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

ประเภท: บูลีน
ค่าเริ่มต้น: true
displayAnnotationsFilter

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

ประเภท: บูลีน
ค่าเริ่มต้น: เท็จ
displayDateBarSeparator

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

ประเภท: บูลีน
ค่าเริ่มต้น: true
displayExactValues

เลือกว่าจะแสดงค่าในรูปแบบโค้งมนแบบย่อที่ด้านบนของกราฟเพื่อประหยัดพื้นที่หรือไม่ ค่าเท็จบ่งบอกว่าอาจแสดงค่าดังกล่าว ตัวอย่างเช่น หากตั้งค่าเป็น "เท็จ" 56123.45 อาจแสดงเป็น 56.12k

ประเภท: บูลีน
ค่าเริ่มต้น: เท็จ
displayLegendDots

เลือกว่าจะแสดงจุดข้างค่าในข้อความคำอธิบายหรือไม่ โดยที่ "จริง" หมายถึง "ใช่"

ประเภท: บูลีน
ค่าเริ่มต้น: true
displayLegendValues

เลือกว่าจะแสดงค่าที่ไฮไลต์ในคำอธิบายหรือไม่ โดยที่ "จริง" หมายถึง "ใช่"

ประเภท: บูลีน
ค่าเริ่มต้น: true
displayRangeSelector

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

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

ประเภท: บูลีน
ค่าเริ่มต้น: true
displayZoomButtons

แสดงปุ่มซูม ("1d 5d 1m" และอื่นๆ) หรือไม่ โดย "เท็จ" หมายถึงไม่

ประเภท: บูลีน
ค่าเริ่มต้น: true
เติม

ตัวเลขตั้งแต่ 0-100 (รวมค่าอัลฟ่า) ที่ระบุอัลฟ่าของการเติมสีใต้แต่ละบรรทัดในกราฟเส้น 100 หมายถึงทึบแสง 100% และ 0 หมายถึงไม่มีการเติมเต็มเลย สีเติมจะเป็นสีเดียวกับเส้นด้านบน

ประเภท: ตัวเลข
ค่าเริ่มต้น: 0
legendPosition

เลือกว่าจะใส่คำอธิบายสีในแถวเดียวกันด้วยปุ่มซูมและวันที่ ("sameRow") หรือในแถวใหม่ ("newRow")

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

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

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

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

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

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

ประเภท: ตัวเลข
ค่าเริ่มต้น: อัตโนมัติ
numberFormats

ระบุรูปแบบตัวเลขที่จะใช้ในการจัดรูปแบบค่าที่ด้านบนของกราฟ

รูปแบบควรอยู่ในรูปแบบที่ระบุโดยคลาส java DecimalFormat ของ java

  • หากไม่ได้ระบุ ระบบจะใช้รูปแบบรูปแบบเริ่มต้น
  • หากระบุรูปแบบสตริงเดียว ระบบจะใช้รูปแบบดังกล่าวกับค่าทั้งหมด

  • หากระบุแผนที่ คีย์จะเป็นดัชนี (แบบศูนย์) ของชุดข้อมูล และค่าจะเป็นรูปแบบที่จะใช้เพื่อจัดรูปแบบชุดข้อมูลที่ระบุ

    คุณไม่จำเป็นต้องใส่รูปแบบสำหรับทุกชุดในแผนภูมิ ซีรีส์ที่ไม่ระบุจะใช้รูปแบบเริ่มต้น

หากระบุตัวเลือกนี้ ระบบจะไม่สนใจตัวเลือก displayExactValues

ประเภท: สตริง หรือการแมปจำนวน:คู่สตริง
ค่าเริ่มต้น: อัตโนมัติ
scaleColumns

ระบุค่าที่จะแสดงบนเครื่องหมายถูกที่แกน Y ในกราฟ ค่าเริ่มต้นคือมีสเกลเดียวทางด้านขวา ซึ่งจะมีผลกับทั้ง 2 ชุดข้อมูล แต่คุณให้ด้านต่างๆ ของกราฟปรับขนาดให้เป็นค่าชุดที่ต่างกันได้

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

  • หากคุณระบุอาร์เรย์ที่ว่างเปล่า แผนภูมิจะไม่แสดงค่า Y ถัดจากเครื่องหมายถูก
  • หากระบุค่าใดค่าหนึ่ง สเกลของชุดที่ระบุจะแสดงที่ด้านขวาของแผนภูมิเท่านั้น
  • หากระบุ 2 ค่า ระบบจะเพิ่มสเกลสำหรับชุดที่ 2 ที่ด้านขวาของแผนภูมิ
  • หากระบุค่า 3 รายการ ระบบจะเพิ่มสเกลสำหรับชุดข้อมูลที่ 3 ไว้ตรงกลางแผนภูมิ
  • ระบบจะไม่สนใจค่าที่อยู่หลังค่าที่ 3 ในอาร์เรย์

เมื่อแสดงมากกว่า 1 สเกล เราขอแนะนำให้ตั้งค่าตัวเลือก scaleType เป็น "allfixed" หรือ "allmaximized" อย่างใดอย่างหนึ่ง

ประเภท: อาร์เรย์ของตัวเลข
ค่าเริ่มต้น: อัตโนมัติ
scaleFormat

รูปแบบตัวเลขที่จะใช้สำหรับป้ายกำกับเครื่องหมายถูกบนแกน ค่าเริ่มต้นของ '#' จะแสดงเป็นจำนวนเต็ม

ประเภท: สตริง
ค่าเริ่มต้น: '#'
scaleType

ตั้งค่าสูงสุดและค่าต่ำสุดที่แสดงบนแกน Y ซึ่งมีตัวเลือกต่อไปนี้

  • "ขยายใหญ่สุด" - แกน Y จะขยายค่าต่ำสุดไปจนถึงค่าสูงสุดของชุดข้อมูล หากมีมากกว่า 1 ชุด ให้ใช้ allmaximized
  • "คงที่" [ค่าเริ่มต้น] - แกน Y จะแตกต่างกันไปตามค่าข้อมูล ดังนี้
    • หากค่าทั้งหมดเป็น >=0 แกน Y จะเริ่มจาก 0 ถึงค่าสูงสุด
    • หากค่าทั้งหมดเป็น <=0 แกน Y จะเริ่มจาก 0 ถึงค่าข้อมูลต่ำสุด
    • หากค่าเป็นทั้งค่าบวกและค่าลบ แกน Y จะอยู่ในช่วงตั้งแต่ค่าสูงสุดของชุดข้อมูลไปจนถึงค่าต่ำสุดของชุด
      หากมีหลายชุด ให้ใช้ "allfixed"
  • "allmaximized" - เหมือนกับ "ขยายใหญ่สุด" แต่ใช้เมื่อแสดงสเกลหลายขนาด แผนภูมิทั้ง 2 แบบจะขยายใหญ่สุดในสเกลเดียวกัน ซึ่งหมายความว่าแผนภูมิหนึ่งๆ จะสื่อให้เข้าใจผิดกับแกน Y แต่เมื่อวางเมาส์เหนือแต่ละชุดจะแสดงค่าที่แท้จริงของแผนภูมินั้น
  • "allfixed" - เหมือนกับ "คงที่" แต่จะใช้เมื่อแสดงสเกลหลายแบบ การตั้งค่านี้จะปรับแต่ละสเกลตามชุดที่เกี่ยวข้อง (ใช้ร่วมกับ scaleColumns)

หากคุณระบุตัวเลือกต่ำสุดและ/หรือสูงสุด ตัวเลือกเหล่านี้จะมีลำดับความสำคัญเหนือกว่าค่าต่ำสุดและสูงสุดที่กำหนดโดยประเภทสเกล

ประเภท: สตริง
ค่าเริ่มต้น: "คงที่"
โต๊ะ

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

var options: {
  table: {
    sortAscending: true,
    sortColumn: 1
  }
};
ประเภท: ออบเจ็กต์
ค่าเริ่มต้น: null
table.sortAscending

หากตั้งค่าเป็น true จะกลับลำดับของตารางคำอธิบายประกอบและแสดงตามลำดับจากน้อยไปมาก

ประเภท: บูลีน
ค่าเริ่มต้น: เท็จ
table.sortColumn

ดัชนีคอลัมน์ของตารางคำอธิบายประกอบที่จะจัดเรียงคำอธิบายประกอบ ดัชนีต้องเป็น 0 สำหรับคอลัมน์ป้ายกำกับคำอธิบายประกอบ หรือ 1 สำหรับคอลัมน์ข้อความคำอธิบายประกอบ

ประเภท: ตัวเลข
ค่าเริ่มต้น: 0
ความหนา

ตัวเลขตั้งแต่ 0-10 (รวม) ที่ระบุความหนาของเส้น โดย 0 คือบางที่สุด

ประเภท: ตัวเลข
ค่าเริ่มต้น: 0
zoomEndTime

ตั้งค่าวันที่/เวลาสิ้นสุดของช่วงการซูมที่เลือก

ประเภท: วันที่
ค่าเริ่มต้น: ไม่มี
zoomStartTime

ตั้งค่าวันที่/เวลาเริ่มต้นของช่วงการซูมที่เลือก

ประเภท: วันที่
ค่าเริ่มต้น: ไม่มี

วิธีการ

วิธีการ
clearChart()

ล้างแผนภูมิ และปล่อยทรัพยากรที่จัดสรรทั้งหมด

ประเภทการคืนสินค้า: ไม่มี
draw(data, options, state)

วาดแผนภูมิ

ประเภทการคืนสินค้า: ไม่มี
getContainer()

ดึงข้อมูลแฮนเดิลไปยังองค์ประกอบคอนเทนเนอร์ที่มีแผนภูมิคำอธิบายประกอบ

ประเภทการแสดงผล: แฮนเดิลกับองค์ประกอบ DOM
getSelection()

การใช้ getSelection() มาตรฐาน องค์ประกอบที่เลือกคือองค์ประกอบของเซลล์ ผู้ใช้เลือกเซลล์ได้เพียงครั้งละ 1 เซลล์

ประเภทผลลัพธ์: อาร์เรย์ขององค์ประกอบการเลือก
getVisibleChartRange()

แสดงผลออบเจ็กต์ที่มีพร็อพเพอร์ตี้ start และ end ซึ่งแต่ละรายการเป็นออบเจ็กต์ Date ซึ่งแสดงการเลือกเวลาปัจจุบัน

Return Type: ออบเจ็กต์ที่มีพร็อพเพอร์ตี้ start และ end
hideDataColumns(columnIndexes)

ซ่อนชุดข้อมูลที่ระบุจากแผนภูมิ ยอมรับพารามิเตอร์ 1 รายการซึ่งอาจเป็นตัวเลขหรืออาร์เรย์ของจำนวน โดย 0 หมายถึงชุดข้อมูลแรก และอื่นๆ

ประเภทการคืนสินค้า: ไม่มี
setVisibleChartRange(start, end)

ตั้งค่าช่วงที่มองเห็นได้ (ซูม) เป็นช่วงที่ระบุ ยอมรับพารามิเตอร์ 2 รายการประเภท Date ที่แสดงครั้งแรกและครั้งสุดท้ายของช่วงที่มองเห็นได้ที่ต้องการที่เลือก ตั้งค่า start เป็น null เพื่อรวมทุกอย่างตั้งแต่วันแรกสุดไปจนถึงสิ้นสุด ตั้งค่า end เป็น null เพื่อรวมทุกอย่างตั้งแต่ start ไปจนถึงวันที่สุดท้าย

ประเภทการคืนสินค้า: ไม่มี
showDataColumns(columnIndexes)

แสดงชุดข้อมูลที่ระบุจากแผนภูมิ หลังจากซ่อนโดยใช้เมธอด hideDataColumns ยอมรับพารามิเตอร์ 1 รายการซึ่งอาจเป็นตัวเลขหรืออาร์เรย์ของตัวเลข โดย 0 หมายถึงชุดข้อมูลแรก และอื่นๆ

ประเภทการคืนสินค้า: ไม่มี

กิจกรรม

ชื่อ
rangechange

เริ่มทำงานเมื่อผู้ใช้เปลี่ยนแถบเลื่อนช่วง ปลายทางของช่วงใหม่จะพร้อมใช้งานเป็น event['start'] และ event['end'] 

google.visualization.events.addListener(chart, 'rangechange', rangechange_handler);

function rangechange_handler(e) {
  console.log('You changed the range to ', e['start'], ' and ', e['end']);
}
พร็อพเพอร์ตี้: เริ่มต้น สิ้นสุด
ready

แผนภูมิพร้อมสำหรับการเรียกใช้เมธอดภายนอกแล้ว หากต้องการโต้ตอบกับแผนภูมิและวิธีเรียกใช้หลังจากที่วาดแล้ว คุณควรตั้งค่า Listener สำหรับเหตุการณ์นี้ก่อนเรียกใช้เมธอด draw และเรียกใช้หลังจากที่เหตุการณ์เริ่มทำงานแล้วเท่านั้น

พร็อพเพอร์ตี้: ไม่มี
select

เริ่มทำงานเมื่อผู้ใช้คลิกเอนทิตีภาพ หากต้องการดูสิ่งที่เลือก โปรดโทรหา getSelection()

พร็อพเพอร์ตี้: ไม่มี

นโยบายข้อมูล

โค้ดและข้อมูลทั้งหมดจะได้รับการประมวลผลและแสดงผลในเบราว์เซอร์ โดยจะไม่มีการส่งข้อมูลไปยังเซิร์ฟเวอร์ใดๆ