> ## Documentation Index
> Fetch the complete documentation index at: https://freelance-4888ed08.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Dashboard Overview

> Interactive demand analytics powered by Plotly Dash

The Demand Forecasting Dashboard is a **Plotly Dash** application designed for interactive exploration of prediction data. Unlike static reports, it allows stakeholders to slice data by seasonality and date ranges in real time.

![Demand Forecasting Dashboard Interface](https://mintcdn.com/freelance-4888ed08/9iX3sa3yNrcTFtgt/images/system-hero-dark.png?fit=max\&auto=format\&n=9iX3sa3yNrcTFtgt\&q=85\&s=761fc078fe27cba32815b52659e0ade4)

## Technology Stack

The UI is built using a Python-native stack, ensuring seamless integration with the data science workflow:

* **Framework**: [Plotly Dash](https://dash.plotly.com/)
* **Components**: `dash-bootstrap-components` (LUMEN theme)
* **Data Source**: Direct Parquet ingestion (High Performance)
* **Styling**: Custom CSS overlay on Bootstrap Grid

## Key Features

The dashboard (`app-ui/app.py`) focuses on three core analytical views:

### 1. Global KPIs

Located at the top, providing immediate context:

* **Total Rentals**: Aggregated demand for the selected period.
* **Avg Temp**: Normalized temperature context.
* **Registered Users**: Growth metric for user base.

### 2. Seasonality Analysis

```python Visualization Logic theme={null}
# How we visualize filtered seasonality
fig2 = px.box(
    filtered_df, 
    x='season_label', 
    y='cnt', 
    color='season_label',
    category_orders={'season_label': ['Spring', 'Summer', 'Fall', 'Winter']},
    color_discrete_map={
        'Spring': '#66BB6A', 
        'Summer': '#FDD835', 
        'Fall': '#FF7043', 
        'Winter': '#42A5F5'
    }
)
```

This box plot reveals the distribution of demand across seasons, highlighting outliers (e.g., unusually high demand in Winter).

### 3. Temperature Correlation

A scatter plot correlating normalized temperature (`temp`) with demand (`cnt`). This validates the model's reliance on weather features:

* **Positive Correlation**: Higher temps generally lead to higher demand.
* **Color Coding**: Points are colored by season to show clustering.

## Architecture

The Dash app runs as a standalone Docker service (`app-ui`), decoupled from the heavy ML training pipelines.

```mermaid theme={null}
graph TD
    %% Styling
    classDef storage fill:#DCFCE7,stroke:#15803d,color:#14532d,stroke-width:2px;
    classDef ui fill:#E0E7FF,stroke:#4338ca,color:#1e1b4b,stroke-width:2px;
    classDef pipeline fill:#FEF3C7,stroke:#b45309,color:#78350f,stroke-width:2px;
    
    subgraph "ML Pipeline (app-ml)"
        direction TB
        Kedro[Kedro Pipeline]:::pipeline
        Parquet[(Parquet Store<br/><i>S3/MinIO</i>)]:::storage
        
        Kedro -->|Writes| Parquet
    end
    
    subgraph "UI Layer (app-ui)"
        direction TB
        Dash[Dash App<br/><i>Stateless</i>]:::ui
        User([Business User]):::ui
        
        Parquet -->|Reads| Dash
        Dash -->|Interacts| User
    end
    
    %% Link Styling
    linkStyle default stroke:#6366f1,stroke-width:2px;
```

It reads the *same* processed parquet files that the model uses, ensuring 100% data consistency between training and visualization.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.