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_properies]]])
- รหัส - รหัสสตริงที่ใช้ในการระบุคอลัมน์ อาจมีการเว้นวรรค รหัสสําหรับแต่ละคอลัมน์ต้องไม่ซ้ํากัน
- data_type - [ไม่บังคับ] คําอธิบายสตริงของประเภทข้อมูล Python ของข้อมูลในคอลัมน์นั้น คุณดูรายการประเภทข้อมูลที่รองรับได้ในเมธอด SingleValueToJS() ตัวอย่างเช่น "สตริง" และ "บูลีน" หากไม่ได้ระบุ ค่าเริ่มต้นคือ "สตริง"
- label - ชื่อที่ใช้ง่ายสําหรับคอลัมน์ ซึ่งอาจแสดงเป็นส่วนหนึ่งของการแสดงภาพ หากไม่ได้ระบุ ระบบจะใช้ค่ารหัส
- custom_properities - พจนานุกรม {String:String} ของพร็อพเพอร์ตี้คอลัมน์ที่กําหนดเอง
สคีมาของตารางคือคอลเล็กชันของตัวอธิบายคอลัมน์ สมาชิกทุกคนในรายการ คีย์พจนานุกรม หรือค่าพจนานุกรมต้องเป็นคอลเล็กชันอื่นหรือทิวลิปของตัวบ่งชี้ คุณใช้พจนานุกรมหรือรายการรวมกันได้ แต่คีย์ ค่า หรือสมาชิกทั้งหมดต้องประเมินตัวเป็นข้อบ่งชี้ในท้ายที่สุด โปรดดูตัวอย่างต่อไปนี้
- รายการคอลัมน์: [('a', 'number'), ('b', 'string')]
- พจนานุกรมของรายการ: {('a', 'number'): [('b', 'number'), ('c', 'string')]}
- พจนานุกรมของพจนานุกรม: {('a', 'number'): {'b': 'number', 'c': 'string'}}
- ก็จะได้ระดับการซ้อนหลายระดับ
3. ป้อนข้อมูล
หากต้องการเพิ่มข้อมูลในตาราง ให้สร้างโครงสร้างขององค์ประกอบข้อมูลในโครงสร้างเดียวกันกับสคีมาของตาราง เช่น หากสคีมาเป็นรายการ ข้อมูลต้องเป็นรายการ ดังนี้
- สคีมา: [("สี", "สตริง"), ("รูปร่าง", "สตริง")]
- ข้อมูล: [["สีน้ําเงิน", "สี่เหลี่ยมจัตุรัส"], ["แดง", "วงกลม"]]
หากสคีมาเป็นพจนานุกรม ข้อมูลต้องเป็นพจนานุกรม
- สคีมา: {("rowname", "string"): [("color", "string"), ("รูปร่าง", "สตริง")] }
- ข้อมูล: {"row1": ["blue", "square"], "row2": ["red", "วงกลม"]}
แถว 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")