ปรับขนาด glyph ด้วย widget

อีกหนึ่งกลุ่มอุตสาหกรรมที่กองทุนเฮดจ์ฟันด์ให้ความสนใจคือธุรกิจเภสัชกรรม เนื่องจากมีนวัตกรรมใหม่เกิดขึ้นอย่างต่อเนื่อง ส่งผลให้มีโอกาสสำหรับบริษัท start-up และ scale-up มากมาย

คุณได้รับมอบหมายให้สร้าง scatter plot แสดงมูลค่าและปริมาณการซื้อขายหุ้นของบริษัทเภสัชกรรม 5 แห่งในชุดข้อมูล ได้แก่ AbbVie, Eli Lilly, Merck, Johnson & Johnson และ Nuformix เนื่องจากยังไม่แน่ใจว่าข้อมูลจะแสดงผลเป็นอย่างไร จึงตัดสินใจใช้ widget Spinner เพื่อให้ผู้มีส่วนได้ส่วนเสียปรับขนาด glyph ได้ตามต้องการ

แบบฝึกหัดนี้เป็นส่วนหนึ่งของหลักสูตร

การสร้างภาพข้อมูลแบบอินเทอร์แอกทีฟด้วย Bokeh

ดูคอร์ส

คำแนะนำการฝึกหัด

นำเข้า layout และ Spinner
สร้าง spinner ชื่อ "Glyph size" โดยกำหนดขนาดตั้งแต่ 1 ถึง 30 พิกเซล เพิ่มทีละ 1 พิกเซลต่อการคลิกหนึ่งครั้ง ค่าเริ่มต้นเป็น 4 และความกว้าง 60
เติมโค้ดใน spinner.js_link() โดยส่ง "value" เป็นอาร์กิวเมนต์แรก ตามด้วย attribute glyph ของ scatter และระบุ "size" เป็น attribute ที่ต้องการปรับด้วย spinner
แสดง layout โดยให้ title อยู่ในแถวเดียว และแถวที่สองแสดง spinner และ fig ตามลำดับ

แบบฝึกหัดเชิงโต้ตอบแบบลงมือทำ

ลองทำแบบฝึกหัดนี้โดยเติมโค้ดตัวอย่างนี้ให้สมบูรณ์

# Import modules
____
____
labels = ["ABBV", "JNJ", "LLY", "MRK", "NFX"]
fig = figure(x_axis_label="Volume", y_axis_label="Stock Price ($)")
scatter = fig.circle(x="volume", y="close", source=source, legend_field="name", fill_color=factor_cmap("name", palette=Category10_5, factors=labels), fill_alpha=0.5)
title = Div(text="Pharmaceuticals Stock Performance")
fig.xaxis[0].formatter = NumeralTickFormatter(format="0a")

# Create spinner
spinner = ____(title="____", low=____, high=____, step=____, value=____, width=____)

# Set up the widget action
spinner.js_link("____", ____.____, "____")
output_file(filename="pharma_stocks.html")

# Display the layout
show(____(____))

แก้ไขและรันโค้ด