ÎncepețiÎncepe gratuit

Tabel interactiv cu statistici cheie

Graficele sunt o modalitate excelentă de a vizualiza datele și de a surprinde valori agregate dintr-o privire. Totuși, uneori ai nevoie să vezi mai multe cifre decât poate afișa un grafic obișnuit.

Directorul departamentului financiar al companiei de e-commerce a auzit de munca ta și ți-a transmis o solicitare: un dashboard cu statistici agregate prezentate în format tabelar. În plus, se întreabă dacă poți adăuga și un pic de „magie Dash" pentru a-l face mai interactiv decât foile lui de calcul Excel.

Acest exercițiu face parte din cursul

Crearea dashboardurilor cu Dash și Plotly

Vezi cursul

Instrucțiuni pentru exercițiu

  • Configurează obiectul money_fmt pentru formatarea valorilor în dolari americani (USD) sub linia 9, folosind funcția și parametrii de stil corespunzători.
  • Adaugă formatorul money_fmt la coloana 'Total Sales ($)' din column_defs, sub linia 15.

Exercițiu interactiv practic

Încearcă acest exercițiu completând acest cod de exemplu.

from dash import Dash, dcc, html, Input, Output, callback
import plotly.express as px
import pandas as pd
from dash_ag_grid import AgGrid
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'
key_stats_tb = ecom_sales.groupby(['Country','Major Category', 'Minor Category'])['OrderValue'].agg(['sum', 'count', 'mean']).reset_index().rename(columns={'count':'Sales Volume', 'sum':'Total Sales ($)', 'mean':'Average Order Value ($)'})

# Set up the money object
money_fmt = {
"____": (
  """params.value.toLocaleString(
  'en-US', {style: '____', currency: '____'})""")}

# Add the formatter to the relevant column
column_defs = [
  {"field": "Major Category"},
  {"field": "Total Sales ($)", "____": ____},
  {"field": "Average Order Value ($)"},
  {"field": "Sales Volume"}]

grid = AgGrid(
  columnDefs=column_defs,
  rowData=key_stats_tb.to_dict("records"))

app = Dash()
app.layout = [
  html.Img(src=logo_link, style={'margin':'30px 0px 0px 0px'}),
  html.H1('Sales Aggregations'),
  html.Div([
    html.H2('Key Aggregations'),
    grid],
    style={'width':'850px', 'height':'750px', 'margin':'0 auto'})
]

if __name__ == '__main__':
    app.run(debug=True)
Editează și rulează codul