---
title: HF-Streamlit
emoji: 👀
colorFrom: gray
colorTo: blue
sdk: streamlit
sdk_version: 1.44.0
app_file: app.py
pinned: false
---

Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

# HF-Streamlit

HF-Streamlit is an interactive data visualization dashboard built with Python and Streamlit that demonstrates the power of modern web-based analytics.

The app generates dynamic time series data and presents it through customizable charts with multiple color themes, real-time filtering capabilities, and exportable datasets.

Users can explore data through an intuitive interface featuring adjustable parameters (data size, chart height, color schemes), filter by categories and value ranges, view key performance metrics, and download filtered results as CSV files.

Perfect for showcasing data science capabilities or as a starting template for building more complex analytical dashboards, this app combines clean UI design with powerful data manipulation features in just a few lines of Python code.

## 📊 Features

- **Interactive Data Visualization**: Dynamic time series charts with customizable color themes
- **Real-time Data Filtering**: Filter datasets by categories and value ranges
- **Data Export**: Download filtered data as CSV files
- **Metrics Dashboard**: Display key performance indicators and statistics
- **Responsive Design**: Clean, modern UI with custom CSS styling
- **Multi-tab Interface**: Organized content across Chart, Data Explorer, and About tabs

## 🚀 Quick Start

### Prerequisites

- Python 3.9 or higher
- pip package manager

### Local Installation

1. Clone the repository:
```bash
git clone <repository-url>
cd HF-Streamlit
```

2. Install dependencies:
```bash
pip install -r requirements.txt
```

3. Run the application:
```bash
streamlit run app.py
```

The app will be available at `http://localhost:8501`

## 🐳 Docker Deployment

### Build and Run with Docker

1. Build the Docker image:
```bash
docker build -t hf-streamlit .
```

2. Run the container:
```bash
docker run -p 7860:7860 hf-streamlit
```

The app will be available at `http://localhost:7860`

### Docker Hub (if applicable)

```bash
docker pull <your-dockerhub-username>/hf-streamlit
docker run -p 7860:7860 <your-dockerhub-username>/hf-streamlit
```

## 🛠️ Dependencies

- **streamlit**: Web app framework for Python
- **pandas**: Data manipulation and analysis
- **numpy**: Numerical computing
- **plotly**: Interactive plotting library

## 📱 Application Structure

```
HF-Streamlit/
├── app.py              # Main Streamlit application
├── requirements.txt    # Python dependencies
├── Dockerfile         # Docker configuration
├── README.md          # Project documentation
└── HF-docker2/        # Additional Docker configurations
```

## 🎯 Usage

### Dashboard Features

1. **Chart Tab**:
   - Adjust data points (10-500) using the sidebar slider
   - Customize chart height (300-800px)
   - Select from 5 color themes (blues, reds, greens, purples, oranges)
   - View real-time metrics and KPIs

2. **Data Explorer Tab**:
   - Filter data by categories (A, B, C, D)
   - Set value range filters using sliders
   - View filtered datasets in tabular format
   - Download filtered data as CSV

3. **About Tab**:
   - Learn about the application features
   - Understand Streamlit capabilities

### Customization

The app includes several customizable parameters:

- **Data Size**: Control the number of data points generated
- **Chart Height**: Adjust visualization height
- **Color Themes**: Choose from predefined color palettes
- **Filtering Options**: Multiple category and range filters

## 🔧 Configuration

### Environment Variables

The application uses default Streamlit configuration. You can customize it by creating a `.streamlit/config.toml` file:

```toml
[server]
port = 8501
address = "0.0.0.0"

[theme]
primaryColor = "#1E88E5"
backgroundColor = "#FFFFFF"
secondaryBackgroundColor = "#F0F2F6"
```

## 🚀 Deployment Options

### Streamlit Cloud
1. Push your code to GitHub
2. Connect your repository to Streamlit Cloud
3. Deploy with one click

### Heroku
1. Add a `Procfile`:
```
web: streamlit run app.py --server.port=$PORT --server.address=0.0.0.0
```

### AWS/GCP/Azure
Use the provided Dockerfile for container-based deployments.

## 🤝 Contributing

1. Fork the repository
2. Create a feature branch (`git checkout -b feature/amazing-feature`)
3. Commit your changes (`git commit -m 'Add amazing feature'`)
4. Push to the branch (`git push origin feature/amazing-feature`)
5. Open a Pull Request

## 📄 License

This project is open source and available under the [MIT License](LICENSE).

## 🆘 Support

If you encounter any issues or have questions:

1. Check the [Streamlit documentation](https://docs.streamlit.io/)
2. Open an issue in this repository
3. Refer to the troubleshooting section below

## 🔍 Troubleshooting

### Common Issues

**Port already in use:**
```bash
streamlit run app.py --server.port=8502
```

**Module not found:**
```bash
pip install -r requirements.txt
```

**Docker build fails:**
Ensure Docker is running and you have sufficient disk space.

## 📈 Performance

The application is optimized with:
- `@st.cache_data` decorator for data generation
- Efficient data filtering operations
- Responsive chart rendering with Plotly

---

Made with ❤️ using [Streamlit](https://streamlit.io/)