Google มีไลบรารี Python แบบโอเพนซอร์สซึ่งสร้างออบเจ็กต์ DataTable
เพื่อใช้กับการแสดงภาพ ไลบรารีนี้ใช้เพื่อสร้าง DataTable
ใน Python และแสดงผลใน 3 รูปแบบต่อไปนี้ได้
- สตริง JSON -- หากคุณโฮสต์หน้าเว็บที่โฮสต์การแสดงภาพที่ใช้ข้อมูลของคุณ คุณสร้างสตริง JSON เพื่อส่งผ่านไปยังตัวสร้าง
DataTable
เพื่อป้อนข้อมูลได้ - การตอบสนอง JSON -- หากไม่ได้โฮสต์หน้าเว็บที่โฮสต์การแสดงภาพ และต้องการทำหน้าที่เป็นแหล่งข้อมูลสำหรับการแสดงภาพภายนอก คุณสามารถสร้างสตริงการตอบกลับ JSON ที่สมบูรณ์ซึ่งแสดงผลตามคำขอข้อมูลได้
- สตริง JavaScript -- คุณส่งออกตารางข้อมูลเป็นสตริงที่ประกอบด้วยโค้ด JavaScript หลายบรรทัดได้ ซึ่งจะสร้างและป้อนข้อมูลออบเจ็กต์
google.visualization.DataTable
ด้วยข้อมูลจากตาราง Python จากนั้นคุณจะเรียกใช้ JavaScript นี้ในเครื่องมือเพื่อสร้างและป้อนข้อมูลออบเจ็กต์google.visualization.DataTable
ได้ ซึ่งโดยปกติจะใช้เพื่อการแก้ไขข้อบกพร่องเท่านั้น
เอกสารนี้ถือว่าคุณเข้าใจการเขียนโปรแกรม Python พื้นฐานและได้อ่านเอกสารประกอบเกี่ยวกับการแสดงข้อมูลผ่านภาพเบื้องต้นสำหรับ การสร้างการแสดงภาพข้อมูลและการใช้การแสดงภาพแล้ว
เนื้อหา
วิธีใช้ไลบรารี
ขั้นตอนพื้นฐานที่มีรายละเอียดมากขึ้นมีดังนี้
1. สร้างออบเจ็กต์ gviz_api.DataTable
นำเข้าไลบรารี gviz_api.py จากลิงก์ด้านบนและสร้างอินสแตนซ์คลาส gviz_api.DataTable
คลาสจะใช้พารามิเตอร์ 2 รายการ ได้แก่ สคีมาตารางซึ่งจะอธิบายรูปแบบข้อมูลในตาราง และข้อมูลเพิ่มเติมที่จะใช้ป้อนในตาราง คุณเพิ่มข้อมูลในภายหลังได้หากต้องการ หรือเขียนทับข้อมูลโดยสมบูรณ์ แต่ไม่สามารถนำแต่ละแถวออก หรือล้างสคีมาของตาราง
2. อธิบายสคีมาของตาราง
สคีมาของตารางระบุโดยพารามิเตอร์ table_description
ที่ส่งผ่านไปยังตัวสร้าง คุณจะเปลี่ยนข้อมูลนี้ในภายหลังไม่ได้ สคีมาอธิบายคอลัมน์ทั้งหมดในตาราง ได้แก่ ประเภทข้อมูลของแต่ละคอลัมน์ รหัส และป้ายกำกับที่ไม่บังคับ
แต่ละคอลัมน์มีการอธิบายด้วย Tuple ดังนี้ (ID [,data_type [,label [,custom_properties]]])
- รหัส - รหัสสตริงที่ใช้ระบุคอลัมน์ ใส่เว้นวรรคได้ รหัสของแต่ละคอลัมน์ต้องไม่ซ้ำกัน
- data_type - [optional] ตัวบ่งชี้สตริงของประเภทข้อมูล Python ของข้อมูลในคอลัมน์นั้น ดูรายการประเภทข้อมูลที่รองรับได้ในเมธอด SingleValueToJS() เช่น "สตริง" และ "บูลีน" หากไม่ได้ระบุไว้ ระบบจะใช้ "สตริง" เป็นค่าเริ่มต้น
- label - ชื่อที่เข้าใจง่ายสำหรับคอลัมน์ ซึ่งอาจแสดงเป็นส่วนหนึ่งของการแสดงภาพ หากไม่ได้ระบุไว้ ระบบจะใช้ค่ารหัส
- custom_properties - พจนานุกรม {String:String} ของพร็อพเพอร์ตี้คอลัมน์ที่กําหนดเอง
สคีมาของตารางเป็นคอลเล็กชันของส่วนย่อยของคอลัมน์อธิบาย สมาชิกทุกคนในรายการ คีย์พจนานุกรม หรือค่าในพจนานุกรมต้องเป็นคอลเล็กชันอื่นหรือ Tuple ที่เป็นตัวบ่งชี้ คุณจะใช้พจนานุกรมหรือรายการผสมกันแบบใดก็ได้ แต่ท้ายที่สุดแล้วทุกคีย์ ค่า หรือสมาชิกจะต้องประเมินเป็น Tuple ของคำอธิบาย ต่อไปนี้เป็นตัวอย่าง
- รายการคอลัมน์: [('a', 'number'), ('b', 'string')]
- Dictionary of lists: {('a', 'number'): [('b', 'number'), ('c', 'string')]}
- Dictionary of dictionaries: {('a', 'number'): {'b': 'number', 'c': 'string'}}
- และดำเนินการซ้อนกันในระดับใดก็ได้
3. เติมข้อมูล
หากต้องการเพิ่มข้อมูลลงในตาราง ให้สร้างโครงสร้างขององค์ประกอบข้อมูลในโครงสร้างเดียวกันกับสคีมาตาราง ดังนั้น หากสคีมาเป็นรายการ ข้อมูลก็ต้องเป็นรายการ
- schema: [("สี", "สตริง"), ("รูปร่าง", "สตริง")]
- data: [["น้ำเงิน", "สี่เหลี่ยมจัตุรัส"], ["แดง", "วงกลม"]]
หากสคีมาเป็นพจนานุกรม ข้อมูลต้องเป็นพจนานุกรม
- สคีมา: {("rowname", "string"): [("color", "string"), ("รูปร่าง", "string")] }
- data: {"row1": ["blue", "square"], "row2": ["red", "circle"]}
แถว 1 แถวของตารางคือส่วนของข้อมูลและสคีมาที่เกี่ยวข้อง ตัวอย่างเช่น วิธีใช้สคีมาของรายการ 2 คอลัมน์กับข้อมูล 2 แถว
Schema:[(color),(shape)] / \ Data: [["blue", "square"], ["red", "circle"]] Table: Color Shape blue square red circle
โปรดทราบว่าคีย์พจนานุกรมที่นี่จะประเมินเพื่อแสดงข้อมูลคอลัมน์ ดูตัวอย่างที่ซับซ้อนมากขึ้นได้ในเอกสารประกอบของเมธอด AppendData() ในโค้ด วัตถุประสงค์ของการอนุญาตให้มีการซ้อนที่ซับซ้อนดังกล่าวคือให้คุณใช้โครงสร้างข้อมูล Python ที่เหมาะสมกับความต้องการ
4. แสดงข้อมูล
รูปแบบเอาต์พุตที่พบบ่อยที่สุดคือ JSON คุณจึงอาจใช้ฟังก์ชัน ToJsonResponse()
เพื่อสร้างข้อมูลที่จะส่งกลับมา อย่างไรก็ตาม หากคุณแยกวิเคราะห์คำขออินพุตและรองรับรูปแบบเอาต์พุตที่แตกต่างกัน คุณจะเรียกใช้วิธีการเอาต์พุตอื่นๆ เพื่อแสดงรูปแบบอื่นๆ ได้ ซึ่งรวมถึงค่าที่คั่นด้วยคอมมา ค่าที่คั่นด้วยแท็บ และ JavaScript โดยปกติแล้ว JavaScript จะใช้สำหรับการแก้ไขข้อบกพร่องเท่านั้น โปรดดูการใช้แหล่งข้อมูลเพื่อดูวิธีประมวลผลคำขอเพื่อให้ได้รูปแบบการตอบกลับที่ต้องการ
ตัวอย่างการใช้งาน
ตัวอย่างวิธีใช้งานรูปแบบเอาต์พุตต่างๆ มีดังนี้
ตัวอย่างของ ToJSon และ ToJS
#!/usr/bin/python import gviz_api page_template = """ <html> <script src="https://www.gstatic.com/charts/loader.js"></script> <script> google.charts.load('current', {packages:['table']}); google.charts.setOnLoadCallback(drawTable); function drawTable() { %(jscode)s var jscode_table = new google.visualization.Table(document.getElementById('table_div_jscode')); jscode_table.draw(jscode_data, {showRowNumber: true}); var json_table = new google.visualization.Table(document.getElementById('table_div_json')); var json_data = new google.visualization.DataTable(%(json)s, 0.6); json_table.draw(json_data, {showRowNumber: true}); } </script> <body> <H1>Table created using ToJSCode</H1> <div id="table_div_jscode"></div> <H1>Table created using ToJSon</H1> <div id="table_div_json"></div> </body> </html> """ def main(): # Creating the data description = {"name": ("string", "Name"), "salary": ("number", "Salary"), "full_time": ("boolean", "Full Time Employee")} data = [{"name": "Mike", "salary": (10000, "$10,000"), "full_time": True}, {"name": "Jim", "salary": (800, "$800"), "full_time": False}, {"name": "Alice", "salary": (12500, "$12,500"), "full_time": True}, {"name": "Bob", "salary": (7000, "$7,000"), "full_time": True}] # Loading it into gviz_api.DataTable data_table = gviz_api.DataTable(description) data_table.LoadData(data) # Create a JavaScript code string. jscode = data_table.ToJSCode("jscode_data", columns_order=("name", "salary", "full_time"), order_by="salary") # Create a JSON string. json = data_table.ToJSon(columns_order=("name", "salary", "full_time"), order_by="salary") # Put the JS code and JSON string into the template. print "Content-type: text/html" print print page_template % vars() if __name__ == '__main__': main()
ตัวอย่างของ ToJSonResponse
ไคลเอ็นต์ระยะไกลใช้ JSonResponse ในคำขอข้อมูล
#!/usr/bin/python import gviz_api description = {"name": ("string", "Name"), "salary": ("number", "Salary"), "full_time": ("boolean", "Full Time Employee")} data = [{"name": "Mike", "salary": (10000, "$10,000"), "full_time": True}, {"name": "Jim", "salary": (800, "$800"), "full_time": False}, {"name": "Alice", "salary": (12500, "$12,500"), "full_time": True}, {"name": "Bob", "salary": (7000, "$7,000"), "full_time": True}] data_table = gviz_api.DataTable(description) data_table.LoadData(data) print "Content-type: text/plain" print print data_table.ToJSonResponse(columns_order=("name", "salary", "full_time"), order_by="salary")