ภาพรวมของแผนภูมิ

เครื่องมือแก้ไขโค้ด JavaScript ของ Earth Engine ผสานรวมกับ Google Charts อย่างราบรื่นเพื่อการแสดงข้อมูลตารางที่สะดวกผ่านฟังก์ชัน ui.Chart แผนภูมิจะแสดงแบบอินเทอร์แอกทีฟในคอนโซลตัวแก้ไขโค้ด, ui.Panelวิดเจ็ต และในแท็บเบราว์เซอร์แบบสแตนด์อโลน

DataTable แผนภูมิ

Earth Engine ใช้ Google Visualization API เพื่อรองรับผัง API ยอมรับ DataTable ซึ่งเป็นตาราง 2 มิติที่แถวคือข้อมูลสังเกตการณ์และคอลัมน์คือแอตทริบิวต์การสังเกตการณ์ แผนภูมิทั้งหมดใน Earth Engine มาจาก DataTable วิดเจ็ต ui.Chart ช่วยให้คุณระบุ DataTable ได้โดยตรง วิธีการนี้เปิดโอกาสให้ปรับแต่งแผนภูมิได้มากที่สุด แต่อาจไม่สะดวกเท่าวิธีการสร้างแผนภูมิสำหรับออบเจ็กต์ Earth Engine ที่เฉพาะเจาะจง (ดูส่วนถัดไป) ดูข้อมูลเพิ่มเติมเกี่ยวกับการสร้างแผนภูมิจาก DataTable

แผนภูมิออบเจ็กต์ของ Earth Engine

วิดเจ็ต ui.Chart มีเมธอดตัวช่วยในการสร้าง DataTable และแสดงผลแผนภูมิจากออบเจ็กต์ Image, ImageCollection, Feature, FeatureCollection, Array และ List ฟังก์ชันแต่ละรายการยอมรับประเภทข้อมูลหนึ่งๆ และมีวิธีการลดข้อมูลเป็นรูปแบบตารางในการจัดเรียงที่หลากหลายซึ่งกำหนดการกำหนดข้อมูลให้กับชุดและแกนของแผนภูมิ

ไปที่ลิงก์ต่อไปนี้เพื่อดูวิธีสร้างแผนภูมิสําหรับข้อมูลแต่ละประเภท

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

คุณสามารถสร้างแผนภูมิได้หลายประเภท เช่น แผนภูมิกระจาย แผนภูมิเส้น แผนภูมิแท่ง แผนภูมิวงกลม และฮิสโตแกรม กล่าวโดยละเอียดคือ คุณสามารถสร้างแผนภูมิประเภทใดก็ได้ที่มีอยู่ในแพ็กเกจ corechart ของ Google Charts ใช้ui.Chart.setChartType()วิธีนี้เพื่อตั้งค่าประเภทแผนภูมิ แต่ละหน้าที่ลิงก์ในส่วนแผนภูมิออบเจ็กต์ Earth Engine และแผนภูมิ DataTable มีตัวอย่างการสร้างแผนภูมิหลายประเภท

ใช้สตริงต่อไปนี้เป็นอินพุตสำหรับเมธอด ui.Chart.setChartType()

'ScatterChart'
'LineChart'
'ColumnChart'
'BarChart'
'PieChart'
'AreaChart'

มีตัวอย่างดังต่อไปนี้

var data = ee.List([0, 1, 2, 3, 4, 5]);
var chart = ui.Chart.array.values(data, 0, data)
  .setChartType('ColumnChart');
print(chart);

แสดงและดาวน์โหลด

ui.Chart วิดเจ็ตแสดงได้ 3 วิธีดังนี้

var data = ee.List([0, 1, 2, 3, 4, 5]);
var chart = ui.Chart.array.values(data, 0, data);
print(chart);
var data = ee.List([0, 1, 2, 3, 4, 5]);
var chart = ui.Chart.array.values(data, 0, data);
var chartPanel = ui.Panel(chart);
Map.add(chartPanel);
  • ในแท็บเบราว์เซอร์แยกต่างหาก ให้คลิกไอคอนป๊อปอัป () ที่มุมขวาบนของวิดเจ็ต ui.Chart ที่แสดงอยู่ หน้าใหม่จะแสดงแบบเต็มหน้าจอและมีตัวเลือกให้ดาวน์โหลดแผนภูมิเป็นกราฟิก (PNG หรือ SVG) หรือไฟล์ CSV ของข้อมูลพื้นฐาน

การโต้ตอบ

แผนภูมิเป็นแบบอินเทอร์แอกทีฟโดยค่าเริ่มต้น วางเมาส์เหนือจุด เส้น แถบ ฯลฯ เพื่อดูค่า x, y และชุดค่าที่เกี่ยวข้อง คุณสามารถซูมและเลื่อนแกนตามต้องการได้โดยการเปิดใช้งานฟังก์ชัน "เครื่องมือสำรวจ" ของแผนภูมิ

การจัดรูปแบบ

Google Charts ปรับแต่งได้หลากหลายผ่านพร็อพเพอร์ตี้การจัดสไตล์ ใช้เมธอด ui.Chart.setOptions() เพื่อตั้งค่าพร็อพเพอร์ตี้สไตล์แผนภูมิ ดูรายละเอียดทั้งหมดได้ในคู่มือการจัดรูปแบบแผนภูมิ

ข้อจำกัด

ฟังก์ชัน ui.Chart จะแสดงผลองค์ประกอบได้เพียง 5,000 รายการเท่านั้น หาก FeatureCollection, ImageCollection, Array หรือ List ของคุณมีองค์ประกอบมากกว่า ให้พิจารณาวิธีจำกัดข้อมูล หากคุณมีอนุกรมเวลายาวที่มีอัตราการเกิดสูง ให้ลองใช้ระยะเวลาที่สั้นลง การสุ่มตัวอย่างตามช่วงเวลา หรือสร้างคอมโพสิตตามช่วงเวลา หากปัญหาเกี่ยวข้องกับพื้นที่ ให้ลองใช้ชุดย่อยแบบสุ่ม หากคุณกำลังทำงานกับพิกเซลในลิสต์หรืออาร์เรย์ ให้ลองใช้มาตราส่วนขนาดใหญ่ขึ้นเล็กน้อยหรือภูมิภาคที่เล็กลง

การคํานวณที่ใช้เวลานานอาจสร้างแผนภูมิไม่ได้เนื่องจากขีดจํากัดการตอบสนองแบบอินเทอร์แอกทีฟของตัวแก้ไขโค้ด หากคําขอแผนภูมิหมดเวลา ให้ลองส่งออกขั้นตอนกลางของการวิเคราะห์ และสร้างแผนภูมิอีกครั้งจากชิ้นงานที่ส่งออก