Building a Customized GIS Interface using SVG

Table of Contents

Compatibility with other Platforms

The Colorado Division of Water Resources (DWR) is an agency within the Department of Natural Resources providing administration of Colorado's water resources to meet the demands of today, and to provide for the needs of tomorrow. Dealing with the ever increasing challenges of origin issues, reserved rights, wetlands, endangered species recovery and interstate water issues on an already limited water supply has stressed the agency's shrinking personnel and budget resources. The shortfalls are further exacerbated by an increasing need for organizing, maintaining, utilizing, and disseminating spatial data.

As an agency with records dating back to the 1880's, spatial data took numerous forms including hardcopy maps with hand drawn information, legal descriptions, scanned documents tied to spatial locations, and tabular databases. This resulted in various efforts by users to build custom tools or purchase commercial GIS software for task related projects. The end results were disjointed tools with static data and increasing costs for software maintenance and training.

As technology evolved, consolidating multiple user tasks under a single application using a common set of tools became a reality. Paper maps could be scanned, legal descriptions could be converted to GIS format, tabular data could be queried and linked to spatial locations, and input tools could accommodate new data entry. The application could be accessible to DWR and the public in a browser based environment, thus opening agency databases to the public. The autonomous planning and implementation of the past gave way to the consolidated effort to manage GIS data within the agency.

DWR opted to develop a custom GIS web application utilizing open source code (SVG, PHP, JavaScript, and PostgreSQL with PostGIS) technology. In a partnership with Leonard Rice Engineers Inc. (LRE), DWR created AquaMap, a browser based GIS system. AquaMap was developed using the existing DWR SQLServer database for the tabular water information and utilizing the existing ESRI GIS backbone for importing the spatial component. A graphical user interface independent of proprietary software licensing and versions was chosen to control costs; therefore AquaMap utilized open source SVG GUI tools developed by Carto.Net. Bruce Rindahl, Senior Project Manager of LRE, leveraged the existing code and added functionality specific to the needs of DWR. Unlike mapping applications of the past, AquaMap is a highly interactive GIS interface that can be used without the need for expensive and restrictive licensing requirements.

The technology used to develop AquaMap has proven to be ideal for enhancements to meet additional needs of the DWR. For example, the ability to allow circular arcs, an interactive measuring tool, and the ability to merge multiple parcels via AJAX technology was added to AquaMap specifically to allow users to more accurately reflect water use information by parcel. Also, due to the fact that AquaMap was designed to mimic commercial GIS applications, AquaMap can easily utilize existing spatial information as well as tapping external sources such as map services. The following is a brief list that highlights the ability and uses of AquaMap:

  • Utilizes established web standards such that AquaMap works in all popular browsers used by the public including Firefox, Safari, Opera and Internet Explorer (with a free plug-in).

  • Converts survey information (bearings and distances) into a spatially correct GIS polygon.

  • Converts Public Land Survey information for referencing location of point features.

  • Includes a point and click SVG interface to create and digitize new and existing parcel information.

  • Features a Yahoo! Maps interface to locate a specific address without maintaining a separate address lookup service.

  • State-wide well information is updated via a connection to a SQLserver database.

  • Saves the digitized information in the centralized database.

  • Accesses extensive GIS information including roads and streets, streams, counties, and individual parcels from internal data and external map services (FEMA Floodplains).

  • Includes multiple sets of aerial photography for historic and current ground reference.

  • Includes a map creation interface to generate scaled maps in PDF format.

  • Includes a live point and click interface to the State's scanned document database.

The original task needed by DWR was to take legal descriptions of parcels and convert into a GIS format for display. A map interface was first developed based on previous work for a floodplain mapping interface and was from work published by The mapping interface was enhanced with sever new features specific for the AquaMap application. These include:

  • Loading scripts tied to map layers so custom PHP routines can be developed.

  • Enhanced SVG windows to include auto scrolling for oversized content.

  • Improved accuracy for large coordinate systems.

  • Implemented an image tiling interface for faster rendering and caching.

  • Enhanced the digitizing code provided by Andreas Neumann to include arcs and additional geoprocessing features.

  • Interface to print the display to an accurately scaled PDF format via Batik.

Figure 1 shows the main interface screen of AquaMap. The entire State of Colorado is shown and the county boundaries are displayed for reference. Several initial layers are given for the user to display for reference.

Once the user has panned and zoomed to a location of interest, several layers can be displayed for analysis. In Figure-2 a detailed location is shown where the existing wells in the state (a database of over 450,000 records), the PLSS layer for location information, and an aerial background. When the user mouses over a particular well, some important details are shown in the lower right corner of the display.

If the entire attribute list for a particular well is desired, the user simply clicks on the particular well. An SVG window with scroll bars is then displayed. In Figure-3 a well has been clicked by the user and the associated attribute information is displayed in the window. At this point, every attribute in the well database is displayed to the user allowing complete public access to the state's records.

One of the initial requirements of AquaMap was to convert legal descriptions of parcels served by wells to be converted to a GIS format. An Excel spreadsheet developed by the state was modified to convert the coordinate information into an SVG path format. This path information is then loaded into a custom editable layer in AquaMap where the user can adjust the final location of the parcel based on existing reference points such as section corners and aerial photography. AquaMap provides a digitizing menu to perform the final alignment of the information and the storing the final configuration in a GIS format. In addition, free-hand digitizing can be performed based on aerial photography. The required attributes are added via text boxes and pull down menus as needed. In Figure-4 a digitized parcel is shown ready for attribute input and saving to the State database.

In addition to the attribute information in the State's database, an extensive document scanning was done by the State. Every paper document associated with each well was scanned and saved for later retrieval by well. AquaMap added an interface where the user could digitize a parcel either by selection, digitizing, or buffering a specific area. A button is then used to identify every well in the selected area and every well within that area is displayed in a separate window. This window includes a hyperlink to the document database detailing all the scanned documents for that well. In Figure-5 a buffer of 3000 feet around a point is shown also with the window giving the hyperlink to the scanned documents associated with that well.

Finally, the official location of a particular well is defined in two ways. The x and y coordinates UTM projection, the latitude and longititude in degrees minutes and seconds, and the distance to the closest section lines are required. In the past, this required a separate program on a users computer was required to create that information. In AquaMap, the user can click on a specific point in the display to pan the map to that location. A separate window is then open to give all the required information for location of the well. If the location is already available, this can be entered in the appropriate text boxes and pull down menus to zoom to the specified location for quality control purposes. In Figure-6 the location window is shown with the separate tabs to give all the required information for the location of interest.

AquaMap meets the needs of the users as well as IT goals. The SVG mapping interface has been a relatively easy transition for almost all users familiar with web or desktop GIS interfaces. The browser based interface allows an unlimited scaling potential only limited by server capacity. Development costs are virtually the same as with a custom proprietary desktop interface. The consolidation of tools and data, which were scattered between various software packages and user groups, provided a one-stop-shopping approach to data needs. Both internal and external users were using a variety of programs to locate and manually synthesize information. The ability of having parties in different locations viewing the same data simultaneously, regardless of being a DWR or public user, has proven to be cost effective. The cost of training on pertinent DWR applications coupled with the transparency of the tool between different user groups, have decreased the learning curve for new employees as well as employees who move within the agency. In addition, the training and maintenance time saved by GIS Staff has been spent transferring the programming tasks from LRE to DWR to create an environment of employee retention by creating new career paths within the GIS group. The greatest benefit to the people of Colorado has been four-fold: 1) Information and tools are publicly available; 2) Open source code has provided a cost effective way to develop user tools; 3) Consolidating spatial data has decreased training cost; and 4) IT employee retention has increased because of new career opportunities

The official AquaMap site including a users’ manual can be found at and clicking on the AquaMap link on the right hand side of the page. A full demonstration location is available for interested parties at