วิเคราะห์ที่ตั้งของลูกค้าชั้นนำ
จากผลงานที่ผ่านมา บริษัท e-commerce ได้ขอให้ช่วยขยายรายงานยอดขายตามประเทศที่มีอยู่
ผู้จัดการฝ่ายขายต้องการทำความเข้าใจว่าลูกค้าชั้นนำอยู่ที่ไหนบ้าง แต่ยังไม่มีเกณฑ์ที่ชัดเจนว่า 'ชั้นนำ' หมายความว่าอย่างไร จึงต้องการให้ทดลองปรับค่าตัดสินได้อย่างง่ายดาย เพื่อดูว่ากราฟเปลี่ยนแปลงอย่างไรเมื่อใช้เกณฑ์ต่างกัน
ภารกิจของคุณคือช่วยผู้จัดการฝ่ายขายโดยใช้ range input เพื่อสร้างแอปที่อัปเดตแบบ live ซึ่งกรองยอดขายตามมูลค่า OrderValue ขั้นต่ำที่กำหนด
แบบฝึกหัดนี้เป็นส่วนหนึ่งของหลักสูตร
การสร้างแดชบอร์ดด้วย Dash และ Plotly
คำแนะนำการฝึกหัด
- เพิ่ม range input component ชื่อ
dcc.Inputโดยกำหนด identifier เป็นmin_order_valไว้ใต้บรรทัดที่34เพื่อให้ผู้ใช้เลือกค่าได้ตั้งแต่50ถึง550 - ใน callback ใต้บรรทัดที่
53ให้ตรวจสอบinput_valและกรอง DataFramesalesโดยเลือกเฉพาะแถวที่มีOrderValueมากกว่าค่าที่เลือก
แบบฝึกหัดเชิงโต้ตอบแบบลงมือทำ
ลองทำแบบฝึกหัดนี้โดยเติมโค้ดตัวอย่างนี้ให้สมบูรณ์
from dash import Dash, dcc, html, Input, Output, callback
import plotly.express as px
import pandas as pd
from datetime import datetime, date
ecom_sales = pd.read_csv('/usr/local/share/datasets/ecom_sales.csv')
logo_link = 'https://assets.datacamp.com/production/repositories/5893/datasets/fdbe0accd2581a0c505dab4b29ebb66cf72a1803/e-comlogo.png'
def make_break(num_breaks):
br_list = [html.Br()] * num_breaks
return br_list
def add_logo():
corp_logo = html.Img(
src=logo_link,
style={'width':'75px','margin':'20px 20px 5px 5px','border':'1px dashed lightblue','display':'inline-block'})
return corp_logo
def style_c():
layout_style={'display':'inline-block','margin':'0 auto','padding':'20px'}
return layout_style
app = Dash()
app.layout = [
add_logo(),
*make_break(2),
html.H1('Sales Dashboard'),
*make_break(3),
html.Div([
html.H2('Controls', style=style_c()),
html.H3('Set minimum OrderValue'),
*make_break(2),
dcc.Input(
# Add a range input
id='min_order_val', type='____',
____=____, ____=____, value=50,
debounce=False,
style={'width':'300px', 'height':'30px'})],
style={'width':'350px', 'height':'350px', 'vertical-align':'top', 'border':'1px solid black',
'display':'inline-block', 'margin':'0px 80px'}),
html.Div([
dcc.Graph(id='sales_country'),
html.H2('Sales Quantity by Country', style={ 'border':'2px solid black', 'width':'400px', 'margin':'0 auto'})],
style={'width':'500px','display':'inline-block'})
]
@callback(
Output(component_id='sales_country', component_property='figure'),
Input(component_id='min_order_val', component_property='value'))
def update_plot(input_val):
sales = ecom_sales.copy(deep=True)
# Check for input and filter sales
if ____:
input_val = round(float(input_val), 2)
sales = sales[sales['OrderValue'] > ____]
fig = px.scatter(data_frame=sales, y='OrderValue', height=400,
x='Quantity', color='Country',
title=f'Orders of Min Value ${input_val}')
return fig
if __name__ == '__main__':
app.run(debug=True)