Web application built with React and D3.js to facilitate working with the Landlab modeling tool

A fundamental part of the Landlab modeling toolkit is the underlying grid class. This interactive, online app helps Landlab users and developers visualize this grid management system so they can intelligently manipulate it. A series of hoverable/clickable layers show the location and/or id of each element of the grid. The grid is used to define dynamic processes and calculate flows over a surface.

 

Use the live app here: https://landlab.github.io/grid-sketchbook.

 

Built in Javascipt, ES-2015, using React and D3.js.

  • Project Type: Web Application
  • Goals and Constraints: Help developers and modelers visualize the underlying grid structure made of numbered cells, patches, nodes, corners, faces, and links.
  • Solution: Create a layered visualization using transparency and interaction to show the structure of the grid's elements and labels.
  • Skill Used: JavaScript, Node.js, D3.js, React, HTML, CSS
  • Live app: https://landlab.github.io/grid-sketchbook/