BaşlayınÜcretsiz başlayın

Satış verileri için kaydırıcı

Küresel e-ticaret şirketinin verilerindeki eğilim ve desenlerin analizi, tarih seçicilerinle büyük ölçüde gelişti. Şimdi de “yüksek tutarlı” siparişleri hangi kategorilerin sürüklediğini görmek istiyorlar.

Şirket, herhangi bir değeri seçebilecekleri ve bir grafikte bu değerden daha yüksek sipariş tutarına sahip kaç satış olduğunu, ana kategoriye göre bölünmüş şekilde görebilecekleri bir araç istiyor.

Bunun bir aralık girişiyle gayet iyi sağlanacağını biliyorsun.

Bu egzersiz, kursun bir parçasıdır

Dash ve Plotly ile Paneller Oluşturma

Kursa Göz Atın

Egzersiz talimatları

  • Minimum sipariş tutarını seçmek için value_slider tanımlayıcısına sahip dcc.Slider adlı bir kaydırıcı bileşeni, 16 numaralı satırın altına ekle.
  • Kaydırıcının value parametresini 0 olarak 20 numaralı satırın altına ayarla.
  • Kaydırıcının step parametresini 50 olarak 22 numaralı satırın altına ayarla.

Uygulamalı etkileşimli egzersiz

Bu egzersizi bu örnek kodu tamamlayarak deneyin.

from dash import Dash, dcc, html, Input, Output, callback
import plotly.express as px
import pandas as pd
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'

app = Dash()

app.layout = [
  html.Img(src=logo_link, style={'margin':'30px 0px 0px 0px'}),
  html.H1('Sales breakdowns'),
  html.Div([
        html.H2('Controls'),
        html.Br(),
        html.H3('Minimum OrderValue Select'),
        # Add a slider input
        ____(id='value_slider',
            min=ecom_sales['OrderValue'].min(),
            max=ecom_sales['OrderValue'].max(),
            # Set the starting value of the slider
            ____=____,
            # Set the step increment of the slider
            ____=____,
            vertical=False)],
        style={'width':'350px', 'height':'350px', 'display':'inline-block', 'vertical-align':'top', 'border':'1px solid black', 'padding':'20px'}),
  html.Div([
		dcc.Graph(id='sales_cat'),
		html.H2('Sales by Major Category', style={ 'border':'2px solid black', 'width':'400px', 'margin':'0 auto'})],
		style={'width':'700px','display':'inline-block'})
]

@callback(
    Output(component_id='sales_cat', component_property='figure'),
    Input(component_id='value_slider', component_property='value')
)
def update_plot(min_val):
    sales = ecom_sales.copy(deep=True)
    if min_val:
        sales = sales[sales['OrderValue'] >= min_val]
    ecom_bar_major_cat = sales.groupby('Major Category')['OrderValue'].size().reset_index(name='Total Sales Volume')
    bar_fig_major_cat = px.bar(
        title=f'Sales with order value: {min_val}',data_frame=ecom_bar_major_cat, orientation='h', 
        x='Total Sales Volume', y='Major Category')
    return bar_fig_major_cat
  
if __name__ == '__main__':
    app.run(debug=True)
Kodu Düzenle ve Çalıştır