Mesh building and visualization
This article relates to the first part of a three part video series on developing a coastal model. The first video (below) gives an overview on developing a computational mesh and this article aims to go into more detail about some of the tools and techniques used.
The video features various tools that I am developing at JM Coastal to make the whole process of developing a model and visualizing the output easier. I have used Django, a web development framework written in Python, to develop the tools. This means that the tools and model runs can be run on a local or remote server, provided the dependencies are installed at that location. As the video series will feature Telemac to run the coastal model, using Django is advantageous. This is because Telemac has a full suite of Python tools for parsing and manipulating the binary geometry and results files and managing the model runs thanks to the developers such as Sebastien Bourban.
The first task in mesh building to extract the coastlines in the desired domain. The coast line extractor tool featured in the video uses a JavaScript library for displaying and manipulating maps (OpenLayers) for the front end user interface. The user extracts the desired coastal line by drawing a polygon and the coastline is then extracted from a GSHHG global shape file from NOAA on the server side (using the Python GDAL bindings) for the user to download.
The mesh is generated using Blue Kenue. This is fantastic open source software for developing meshes, initial conditions, boundary conditions and visualizing results for hydrodynamic models in Telemac. The software can fit a triangular finite element mesh to a particular domain geometry with a resolution specified by the user or based on the underlying bathymetry. The bathymetry featured in the video comes from the EMODnet bathymetry database.
The bathymetry can be visualized in 3D in a web browser using threejs a JavaScript library that facilitates displaying 3D graphics using WebGL. The bathymetry is combined with a DTM and satellite imagery from EarthExplorer provided by USGS to create the 3D model. The terrain viewer featured in the video can be used to view 3D visualizations in your browser. There is a basic demo version of this application here.
View 3D scene in WebGL.
The example above is a 3D visualization of the Black Forest in Germany with a red line showing a GPS track of a hike from Freiburg to the top of Shauinsland, a nearby mountain. If you are a Python user and are interested in visualizing tracks from your GPS or applications such as Strava in Google Earth you can clone a gpx file parser I wrote (https://github.com/johnmaskell/gps_tools.git). The tool is useful for visualizing GPS surveys of coasts and rivers, such as dike inspections. It is worth noting that GIS software such as QGIS will also read gpx files from GPS.
3D models in other formats (e.g. Collada) can be included for buildings or structures such as the wind turbine shown above. In low-lying regions such as the Ayeyarwady Delta region in Myanmar (shown below), relatively low resolution DTMs derived from satellites may appear spikey as the noise is relatively large in relation to the gradients in the relief.
View 3D scene in WebGL.
The 3D terrain viewer will be further developed to visualize flood maps, beach profile changes and scour around structures in three dimensions. A great resource I came across for learning about visualization of geospatial data, is the master maps blog from Bjørn Sandvik.
As with the coastline extractor tool, the mesh viewer tool (shown above), uses OpenLayers for the front end user interface where Python takes care of all the processing on the server side. The user can upload their mesh which is converted to kml. After the user has downloaded the kml file, they can drag and drop it onto the map in the browser or view it in Google Earth.
Look out for the next video in the series which will focus on carrying out a tidal simulation using the TPXO tidal database which is partially derived from satellite altimetry. You can also check out other blog articles on the JM Coastal website here.