A comprehensive web and desktop application for uploading, analyzing, and visualizing chemical equipment data. The platform allows users to upload CSV files containing equipment specifications, view detailed analytics, generate PDF reports, and track data history.
- CSV Upload & Validation - Upload chemical equipment data with automatic validation
- Data Analysis - Automatic calculation of statistics (averages, min/max, distributions)
- Data Visualization - Interactive charts and graphs using Chart.js (Web) and Matplotlib (Desktop)
- PDF Report Generation - Generate professional PDF reports with charts and summaries
- History Management - Keep track of last 5 uploaded datasets with Load/Delete actions
- Responsive Design - Works seamlessly on web and desktop platforms
- Real-time data summary statistics with animated stat cards
- Equipment type distribution analysis (Bar, Pie, Multi-bar charts)
- Parameter range analysis (min/max values) with expanded display
- Equipment records table with search/filter functionality
- Fully visible history table with action buttons (Load/Delete)
- User authentication and history tracking
- CORS-enabled API for multiple frontend implementations
- Production-ready with Gunicorn/Heroku deployment support
- Enhanced desktop application with PyQt5 styling
| Layer | Technology | Purpose |
|---|---|---|
| Backend API | Django 5.2 + Django REST Framework | RESTful API for data management |
| Frontend (Web) | React.js + Chart.js | Interactive web dashboard |
| Frontend (Desktop) | PyQt5 + Matplotlib | Desktop application |
| Data Processing | Pandas | CSV parsing and analytics |
| Database | SQLite (dev) / PostgreSQL (prod) | Persistent data storage |
| PDF Generation | ReportLab | Professional report generation |
| Deployment | Gunicorn + Heroku | Cloud hosting and scaling |
| Version Control | Git & GitHub | Collaboration and tracking |
Chemical-Equipment-Parameter-Visualizer/
├── backend/ # Django REST API
│ ├── chemical_equipment/ # Main project configuration
│ │ ├── settings.py # Django settings
│ │ ├── urls.py # URL routing
│ │ ├── wsgi.py # WSGI configuration
│ │ └── asgi.py # ASGI configuration
│ ├── equipment/ # Equipment app
│ │ ├── models.py # Database models
│ │ ├── views.py # API viewsets
│ │ ├── serializers.py # API serializers
│ │ ├── services.py # Business logic
│ │ ├── utils.py # Utility functions
│ │ ├── constants.py # Constants
│ │ ├── exceptions.py # Custom exceptions
│ │ ├── migrations/ # Database migrations
│ │ ├── admin.py # Django admin config
│ │ ├── apps.py # App configuration
│ │ └── tests.py # Unit tests
│ ├── manage.py # Django management
│ ├── requirements.txt # Python dependencies
│ ├── Procfile # Heroku deployment
│ └── venv/ # Virtual environment
├── frontend-web/ # React web application
│ ├── src/
│ ├── public/
│ ├── package.json
│ └── README.md
├── frontend-desktop/ # PyQt5 desktop application
│ ├── main.py
│ ├── requirements.txt
│ └── README.md
├── docs/ # Documentation
│ ├── API.md # API documentation
│ ├── SETUP.md # Setup guide
│ └── DEPLOYMENT.md # Deployment guide
├── README.md # Project overview
├── LICENSE # Project license
└── .gitignore # Git ignore rules
cd backend
python -m venv venv
.\venv\Scripts\Activate.ps1
pip install -r requirements.txt
cd chemical_equipment
python manage.py migrate
python manage.py runserver
# Backend runs on http://localhost:8000/cd frontend-web
npm install
npm start
# Web app runs on http://localhost:3000/cd frontend-desktop
python main.py
# PyQt5 desktop application launches- Python 3.9+
- Node.js 14+ (for web frontend)
- pip & npm
-
Clone the repository
git clone https://github.com/yourusername/Chemical-Equipment-Parameter-Visualizer.git cd Chemical-Equipment-Parameter-Visualizer/backend -
Create virtual environment
python -m venv venv source venv/Scripts/activate # On Windows: .\venv\Scripts\Activate.ps1
-
Install dependencies
pip install -r requirements.txt
-
Apply database migrations
cd chemical_equipment python manage.py migrate -
Create superuser (optional)
python manage.py createsuperuser
-
Run development server
python manage.py runserver
The API will be available at http://localhost:8000/api/
- Navigate to frontend-web directory
- Install dependencies:
npm install - Ensure backend is running on
http://localhost:8000 - Start development server:
npm start - Access at
http://localhost:3000
- Navigate to frontend-desktop directory
- Create virtual environment:
python -m venv venv - Activate:
.\venv\Scripts\Activate.ps1(Windows) orsource venv/bin/activate(Unix) - Install requirements:
pip install -r requirements.txt - Ensure backend is running on
http://localhost:8000 - Run:
python main.py
http://localhost:8000/api/
POST /datasets/upload/
Request:
- Content-Type: multipart/form-data
- File field:
file(CSV format required)
Expected CSV Columns:
- Equipment Name (string)
- Type (string)
- Flowrate (float)
- Pressure (float)
- Temperature (float)
Response (201 Created):
{
"id": 1,
"filename": "equipment_data.csv",
"uploaded_at": "2026-01-29T10:30:00Z",
"total_records": 25,
"summary": {
"total_count": 25,
"avg_flowrate": 15.5,
"avg_pressure": 102.3,
"avg_temperature": 75.4,
"min_flowrate": 5.0,
"max_flowrate": 25.0,
"min_pressure": 95.0,
"max_pressure": 110.0,
"min_temperature": 60.0,
"max_temperature": 90.0,
"type_distribution": {
"Pump": 8,
"Heat Exchanger": 10,
"Compressor": 7
}
},
"equipment_records": [...]
}GET /datasets/
Response (200 OK): Returns last 5 datasets ordered by upload time, with complete equipment records included
[
{
"id": 1,
"filename": "equipment_data.csv",
"uploaded_at": "2026-02-02T21:30:00Z",
"total_records": 25,
"summary": {
"total_count": 25,
"avg_flowrate": 15.5,
"avg_pressure": 102.3,
"avg_temperature": 75.4,
"min_flowrate": 5.0,
"max_flowrate": 25.0,
"min_pressure": 95.0,
"max_pressure": 110.0,
"min_temperature": 60.0,
"max_temperature": 90.0,
"type_distribution": {
"Pump": 8,
"Heat Exchanger": 10,
"Compressor": 7
}
},
"equipment_records": [
{
"id": 1,
"equipment_name": "Pump A",
"equipment_type": "Pump",
"flowrate": 12.5,
"pressure": 100.5,
"temperature": 75.2
},
{...}
]
}
]GET /datasets/{id}/
Response (200 OK): Full dataset with all equipment records
GET /datasets/{id}/generate_pdf/
Response: PDF file download with charts and statistics
Invalid File Format (400):
{
"error": "File must be CSV format"
}Missing Columns (400):
{
"error": "Missing required columns: Flowrate, Temperature"
}No Valid Data (400):
{
"error": "No valid data found in CSV"
}Create a CSV file with the following structure:
Equipment Name,Type,Flowrate,Pressure,Temperature
Pump A,Pump,12.5,100.5,75.2
Heat Exchanger 1,Heat Exchanger,20.0,105.0,80.5
Compressor B,Compressor,15.3,110.0,85.0
Pump C,Pump,10.0,98.5,70.0- CORS enabled for frontend communication
- Input validation on file uploads
- SQL injection protection via ORM
- CSRF protection on POST requests
- Environment variables for sensitive data
- Debug mode disabled in production
id(Primary Key)user(Foreign Key to User, nullable)filename(CharField)uploaded_at(DateTimeField, auto-set)total_records(IntegerField)summary_data(TextField, JSON format)
id(Primary Key)dataset(Foreign Key to Dataset)equipment_name(CharField)equipment_type(CharField)flowrate(FloatField)pressure(FloatField)temperature(FloatField)
Run unit tests:
python manage.py testUpload a CSV:
curl -X POST http://localhost:8000/api/datasets/upload/ \
-F "file=@sample_equipment_data.csv"List datasets:
curl http://localhost:8000/api/datasets/Get PDF report:
curl http://localhost:8000/api/datasets/1/generate_pdf/ \
-o report.pdf