ÎncepețiÎncepe gratuit

Combinarea HTML cu Dash

Ai colaborat cu o companie de e-commerce pentru a vizualiza datele acesteia, iar acum este momentul să duci prezentarea la nivelul următor.

Obiectivul tău este să afișezi graficele de tip linie și bară pe care le-ai creat anterior, line_graph și bar_graph, împreună într-un singur dashboard Dash. Pentru a da un aspect complet, vei adăuga și un titlu în partea de sus a layout-ului.

Graficele de tip linie și bară (line_graph și bar_graph) au fost recreate pentru tine.

Acest exercițiu face parte din cursul

Crearea dashboardurilor cu Dash și Plotly

Vezi cursul

Instrucțiuni pentru exercițiu

  • Adaugă un titlu în aplicația ta Dash ca element .H1() care să conțină textul 'Sales by Country & Over Time'.
  • Adaugă figurile line_graph și bar_graph în layout-ul aplicației Dash.

Exercițiu interactiv practic

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

from dash import Dash, dcc, html
import pandas as pd
import plotly.express as px
ecom_sales = pd.read_csv('/usr/local/share/datasets/ecom_sales.csv')
ecom_line = ecom_sales.groupby(['Year-Month','Country'])['OrderValue'].agg('sum').reset_index(name='Total Sales ($)')
ecom_bar = ecom_sales.groupby('Country')['OrderValue'].agg('sum').reset_index(name='Total Sales ($)')
line_graph = px.line(data_frame=ecom_line, x='Year-Month', y='Total Sales ($)', title='Total Sales by Month', color='Country')
bar_graph = px.bar(data_frame=ecom_bar, x='Total Sales ($)', y='Country', orientation='h',title='Total Sales by Country')

app = Dash()

# Set up the layout
app.layout = [
  # Add a H1
  html.____('____'),
  # Add both graphs
  dcc.____(id='line_graph', figure=____),
  dcc.____(id='bar_graph', figure=____)
  ]

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