Hydro3DJS: A Modular Web-Based Library for Real-Time 3D Visualization of Watershed Dynamics and Digital Twin Integration

Ramteja Sajja, Omer Mermer, Yusuf Sermet, Ibrahim Demir

Effective visualization of hydrological data is critical for addressing challenges such as flood risk, water resources management, and climate adaptation. This study introduces Hydro3DJS, a modular, web-based 3D visualization library that integrates real-time environmental data with interactive digital twin capabilities. Developed using JavaScript, WebGL, and Google Maps API, the tool enables dynamic simulation of hydrological and atmospheric processes, including rainfall, flood events, and infrastructure exposure, within a spatially accurate and browser-accessible interface. The system supports live data ingestion from sources like USGS and NOAA and renders terrain-aware water dynamics, customizable 3D infrastructure, and sensor overlays. We demonstrate its functionality through two use cases: a rural flood scenario featuring multi-hazard elements, and an urban simulation of a 100-year flood event with real-time stream gauge integration. A usability study with 20 domain experts confirmed the platform’s value for planning, analysis, and stakeholder communication, while also identifying areas for future enhancement in performance and interoperability.