{"id":29189447,"url":"https://github.com/exploring-solver/scadaverse-cranedashboard","last_synced_at":"2025-07-01T23:07:57.059Z","repository":{"id":302162484,"uuid":"1011465081","full_name":"exploring-solver/scadaverse-cranedashboard","owner":"exploring-solver","description":null,"archived":false,"fork":false,"pushed_at":"2025-06-30T22:49:41.000Z","size":180,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-06-30T23:19:43.594Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/exploring-solver.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-06-30T21:30:35.000Z","updated_at":"2025-06-30T22:49:44.000Z","dependencies_parsed_at":"2025-06-30T23:19:59.050Z","dependency_job_id":null,"html_url":"https://github.com/exploring-solver/scadaverse-cranedashboard","commit_stats":null,"previous_names":["exploring-solver/scadaverse-cranedashboard"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/exploring-solver/scadaverse-cranedashboard","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/exploring-solver%2Fscadaverse-cranedashboard","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/exploring-solver%2Fscadaverse-cranedashboard/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/exploring-solver%2Fscadaverse-cranedashboard/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/exploring-solver%2Fscadaverse-cranedashboard/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/exploring-solver","download_url":"https://codeload.github.com/exploring-solver/scadaverse-cranedashboard/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/exploring-solver%2Fscadaverse-cranedashboard/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263047676,"owners_count":23405280,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-07-01T23:07:56.411Z","updated_at":"2025-07-01T23:07:57.009Z","avatar_url":"https://github.com/exploring-solver.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# SCADA-Powered 3D Digital Twin Platform\n\nA modular, real-time digital twin platform that visualizes industrial SCADA data in an interactive 3D environment. This foundational module establishes the infrastructure for future AI, simulation, and voice twin capabilities.\n\n## 🎯 Features\n\n### Phase 1 (Current)\n- **Real-time SCADA Data Visualization**: Live sensor data displayed in 3D industrial environment\n- **WebSocket Integration**: Sub-100ms latency from sensor to 3D visualization\n- **Modular Architecture**: Component-based design for easy extensibility\n- **Mock Data Generation**: Python-based SCADA simulator for development and testing\n- **Supabase Integration**: Real-time database for sensor data persistence\n- **Interactive 3D Scene**: Three.js-powered industrial equipment visualization\n- **Status Monitoring**: Real-time sensor status with color-coded alerts\n\n### Future Phases (Extensibility Hooks)\n- **Phase 2**: Advanced analytics and historical data visualization\n- **Phase 3**: AI-powered anomaly detection and predictive maintenance\n- **Phase 4**: Voice twin integration with natural language queries\n\n## 🏗️ Architecture\n\n```\n/project-root\n  /backend\n    ├── scada_listener.js          # WebSocket server for real-time data\n    ├── mock_data_gen.py           # SCADA data simulator\n    └── supabase_client.js         # Database integration\n  /frontend\n    /components\n      ├── SceneCanvas.jsx          # Three.js 3D scene\n      ├── ModelLoader.jsx          # 3D equipment models\n      ├── DeviceMapper.jsx         # Data-to-visual mapping\n      └── SensorPanel.jsx          # SCADA monitoring panel\n    /store\n      └── digitalTwinStore.js      # Zustand state management\n    /utils\n      ├── syncFromPhysical.js      # Real-time synchronization\n      └── config.json              # Sensor-to-3D mappings\n```\n\n## 🚀 Quick Start\n\n### Prerequisites\n- Node.js 18+\n- Python 3.8+\n- Modern web browser with WebGL support\n\n### Installation\n\n1. **Install dependencies**:\n   ```bash\n   npm install\n   ```\n\n2. **Start the development server**:\n   ```bash\n   npm run dev\n   ```\n\n3. **Start the SCADA WebSocket server** (in a new terminal):\n   ```bash\n   npm run backend\n   ```\n\n4. **Start mock data generation** (in another terminal):\n   ```bash\n   npm run mock-data\n   ```\n\nThe application will be available at `http://localhost:3000`\n\n## 📊 Sensor Types \u0026 Monitoring\n\nThe platform currently simulates and visualizes:\n\n- **Temperature Sensors**: Pump, vessel, and flow temperatures\n- **Pressure Sensors**: System pressure monitoring\n- **Flow Sensors**: Fluid flow rate measurement\n- **Vibration Sensors**: Equipment health monitoring\n\n### Status Thresholds\n- **Normal**: Green indicators, optimal operating range\n- **Warning**: Yellow indicators, approaching limits\n- **Critical**: Red indicators, immediate attention required\n\n## 🔧 Configuration\n\n### Sensor Mappings\nEdit `src/utils/config.json` to configure:\n- Sensor-to-3D object mappings\n- Visual transformation rules\n- Device type definitions\n- SCADA connection settings\n\n### Example Mapping\n```json\n{\n  \"pump_001_temp\": {\n    \"objectId\": \"pump_001\",\n    \"property\": \"color\",\n    \"transform\": {\n      \"type\": \"color\",\n      \"ranges\": [\n        { \"min\": 0, \"max\": 60, \"color\": \"#10b981\" },\n        { \"min\": 60, \"max\": 80, \"color\": \"#f59e0b\" },\n        { \"min\": 80, \"max\": 100, \"color\": \"#ef4444\" }\n      ]\n    }\n  }\n}\n```\n\n## 🗄️ Database Setup (Optional)\n\nTo enable data persistence and historical analysis:\n\n1. **Create a Supabase project** at [supabase.com](https://supabase.com)\n\n2. **Run the database migrations** in your Supabase SQL editor:\n   ```sql\n   -- Create devices table\n   CREATE TABLE devices (\n     device_id TEXT PRIMARY KEY,\n     name TEXT NOT NULL,\n     type TEXT NOT NULL,\n     status TEXT DEFAULT 'unknown',\n     last_update TIMESTAMPTZ DEFAULT NOW(),\n     metadata JSONB DEFAULT '{}'\n   );\n\n   -- Create sensors table\n   CREATE TABLE sensors (\n     id BIGSERIAL PRIMARY KEY,\n     sensor_id TEXT NOT NULL,\n     device_id TEXT REFERENCES devices(device_id),\n     type TEXT NOT NULL,\n     value NUMERIC NOT NULL,\n     unit TEXT,\n     quality TEXT DEFAULT 'good',\n     timestamp TIMESTAMPTZ DEFAULT NOW()\n   );\n\n   -- Create alarms table\n   CREATE TABLE alarms (\n     alarm_id TEXT PRIMARY KEY,\n     device_id TEXT REFERENCES devices(device_id),\n     sensor_id TEXT,\n     severity TEXT NOT NULL,\n     message TEXT NOT NULL,\n     value NUMERIC,\n     threshold NUMERIC,\n     acknowledged BOOLEAN DEFAULT FALSE,\n     acknowledged_by TEXT,\n     acknowledged_at TIMESTAMPTZ,\n     timestamp TIMESTAMPTZ DEFAULT NOW()\n   );\n\n   -- Enable RLS\n   ALTER TABLE devices ENABLE ROW LEVEL SECURITY;\n   ALTER TABLE sensors ENABLE ROW LEVEL SECURITY;\n   ALTER TABLE alarms ENABLE ROW LEVEL SECURITY;\n\n   -- Create policies (adjust based on your auth requirements)\n   CREATE POLICY \"Allow all operations\" ON devices FOR ALL USING (true);\n   CREATE POLICY \"Allow all operations\" ON sensors FOR ALL USING (true);\n   CREATE POLICY \"Allow all operations\" ON alarms FOR ALL USING (true);\n   ```\n\n3. **Configure environment variables** in `.env`:\n   ```\n   VITE_SUPABASE_URL=your_supabase_url\n   VITE_SUPABASE_ANON_KEY=your_supabase_anon_key\n   ```\n\n## 🎮 Usage\n\n### Real-time Monitoring\n- **3D Scene**: Interact with the 3D environment using mouse controls\n- **Sensor Panel**: Monitor real-time sensor values and status\n- **Device Selection**: Click on devices in the 3D scene or sensor panel for details\n\n### Data Simulation\nThe mock data generator creates realistic sensor patterns including:\n- Normal operational variance\n- Gradual drift over time\n- Cyclic patterns (daily/operational cycles)\n- Occasional anomalies and spikes\n\n### Visual Feedback\n- **Color Coding**: Equipment changes color based on sensor status\n- **Animations**: Rotating components indicate active operation\n- **Status Indicators**: LED-style indicators show real-time status\n\n## 🔌 Extensibility\n\nThe platform is designed for future enhancements:\n\n### Phase 2 Hooks\n```javascript\n// Historical data analysis\nfunction analyzeHistoricalTrends(sensorId, timeRange) { /* TODO */ }\n\n// Advanced visualization\nfunction renderHeatMaps(data) { /* TODO */ }\n```\n\n### Phase 3 Hooks\n```javascript\n// AI anomaly detection\nfunction runAnomalyDetection(data) { /* TODO */ }\n\n// Predictive maintenance\nfunction predictMaintenanceNeeds(deviceId) { /* TODO */ }\n\n// Simulation engine\nfunction simulateStateChange(params) { /* TODO */ }\n```\n\n### Phase 4 Hooks\n```javascript\n// Voice twin integration\nfunction getVoiceCommandResponse(query) { /* TODO */ }\n\n// Natural language processing\nfunction processVoiceQuery(audio) { /* TODO */ }\n```\n\n## 🛠️ Development\n\n### Adding New Sensors\n1. Update `backend/mock_data_gen.py` with new sensor configuration\n2. Add mapping in `src/utils/config.json`\n3. Update 3D models in `src/components/ModelLoader.jsx`\n\n### Custom 3D Models\nReplace placeholder geometries with GLB models:\n```javascript\nimport { useGLTF } from '@react-three/drei'\n\nfunction CustomModel({ url }) {\n  const { scene } = useGLTF(url)\n  return \u003cprimitive object={scene} /\u003e\n}\n```\n\n### Real SCADA Integration\nReplace WebSocket mock server with actual SCADA protocols:\n- Modbus TCP/IP\n- OPC UA\n- MQTT\n- DNP3\n\n## 📈 Performance\n\n- **Latency**: \u003c100ms from sensor update to 3D visualization\n- **Update Rate**: 1Hz default (configurable)\n- **Concurrent Sensors**: Tested with 50+ sensors\n- **Browser Compatibility**: Modern browsers with WebGL 2.0\n\n## 🤝 Contributing\n\n1. Fork the repository\n2. Create a feature branch\n3. Follow the modular architecture patterns\n4. Add tests for new functionality\n5. Submit a pull request\n\n## 📄 License\n\nMIT License - see LICENSE file for details\n\n## 🔗 Links\n\n- [Three.js Documentation](https://threejs.org/docs/)\n- [React Three Fiber](https://docs.pmnd.rs/react-three-fiber)\n- [Supabase Documentation](https://supabase.com/docs)\n- [WebSocket API](https://developer.mozilla.org/en-US/docs/Web/API/WebSocket)\n\n---\n\n**Built with ❤️ for the Industrial IoT community**","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fexploring-solver%2Fscadaverse-cranedashboard","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fexploring-solver%2Fscadaverse-cranedashboard","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fexploring-solver%2Fscadaverse-cranedashboard/lists"}