Back to Projects

2024
EMS SCADA Editor
Diagram & Topology Builder
ReactTypeScriptCanvasWebSocketDrag-and-drop
Overview
Specialized editor for creating SCADA diagrams with symbols, connections, and bindings to live tags.
My Role
Led UI implementation for canvas interactions, tooling palettes, and persistence flows.
Highlights
- Developed drag-and-drop and selection models for diagram elements.
- Synced symbol states with WebSocket telemetry for live visual feedback.
- Handled large diagrams with virtualization and incremental rendering strategies.
- Added undo-friendly editing patterns for operator confidence.
Outcome
Operators can author and maintain SCADA views in-product without external drawing tools.