Green Solutions for Storm Water Management

Main Mapper page, with View and Search panel options

Layer management in Green Solutions mapper

Site Report Page for Green Solutions Mapper (PDF report)

Search functions in Green Solutions Mapper

Property Detail element of Green Solutions Mapper

Client: Community Conservation Solutions

Growing population makes for challenges in the management of California's water supply. Recent state legislation (and common sense!) emphasize strategies that allow for storm water to drain into the ground and be re-used for irrigation rather than being channeled into stormdrains and directed to our rivers and oceans. These "green solution" strategies can have dramatic effects on local water supplies, replenishing aquifers and reducing greenhouse gases from the energy needed to import water over long distances. Community Conservation Solutions (CCS) has been a leader in pushing for these approaches and asked GreenInfo Network to develop an online mapping application to help present their most recent work in the Los Angeles region.

CCS worked with a team of engineers, climate change and habitat restoration specialists (including ESA, VS2 Consulting, CH2M, WSP-Parsons Brinckerhoff) to develop a detailed assessment of publicly owned sites that might be candidates for applying Green Solutions management practices, focusing on the Upper Los Angeles River watershed. The details of this major study can be downloaded from the CCS web site.

To develop the Green Solutions mapper, the lead consultant, ESA, provided GreenInfo data for over 400 sites that had been identified and prioritized for implementation, including parks and various types of school properties.

GreenInfo's approach began with a review of target audiences and what they would need out of an online application. This profile was used in developing wireframes of the application. Data review was tested using ArcGIS, defining symbolization and looking for data overlap issues that might arise.

Using this design, GreenInfo web developers created a database system and a mapping framework, plus a user interface concept that provided both the ability to control map layers and the ability to search for sites. The final application features:

Green Solutions sites as points and polygons, and grouped by several "best for" categories
7 layers of reference information (legislative districts, disadvantaged community areas, cities)
Search functions - by site name/keywords, by user-drawn area (circle, polygon), by legislative district
Search filters - 8 choices of types of green solutions parcels to focus in on
Table view of search results, downloadable as a .csv (spreadsheet) file
Data views for each site, including access to a site PDF report and a birds eye view in the mapper

This is a mostly front-end app built using JavaScript, HTML, CSS in the React framework. There is no database; instead we load parcel data from TopoJSON. All parcel searching and display of results is on the client-side. We use Turf.js to support radius and polygon searches in the browser. Map tiles are generated from shapefiles in MapServer, with Leaflet on the front-end.

We used wkhtmltoimage and wkhtmltopdf to create the application's PDF site reports. A PHP batch script dynamically renders the reports in HTML, then wkhtmltopdf renders the HTML to PDF for each site.

Focus: Environment, Government Agencies

Services: Interactive Solutions, GIS Services, Cartography, Applications Development, Web Mapping

Tags: Los Angeles, stormwater

Project Years: 2016