Client-Side Web GIS


The World Wide Web has become a valuable means to display, collect, and share geospatial data and maps. This course will explore the use of web technologies for developing web map applications. Students will learn to produce audience appropriate maps in the web environment using a variety of technologies and methods.

This class will specifically focus on client-side technologies and is broken into three broad components. First, you will learn to design maps and apps and publish data using the tools made available by the Environmental Systems Research Institute (ESRI) including ArcGIS Online, ArcGIS ExperienceBuilder, and ArcGIS Pro. Next, you will explore client-side web programming technologies and languages. You will learn to define web content using hypertext markup language (HTML), style web content using cascading style sheets (CSS) and Bootstrap, and add functionality to a website using JavaScript and jQuery. We will also discuss ESRI's Arcade language for customizing expressions. Lastly, you will learn to produce web maps using the ESRI ArcGIS Maps SDK for JavaScript and the free and open-source Leaflet JavaScript API. Through exploring these topics, you will also learn how the web works and how geospatial data are stored for use in the web environment. You will also develop some coding skills specific to HTML, CSS, and JavaScript. By the end of this course, you will be able to design a multipage website that includes web maps.

You will work through a series of modules that present information relating to a specific topic. You will also complete a series of projects. Please see the sequencing document for our suggestions as to the order in which to work through the material. We have also provided PDF versions of the lectures with the notes/transcripts included and also versions formatted as note handouts. Example code and required data have been provided in a compressed folder (Code and Data button below).

This course makes use of the ArcGIS Pro software package from the Environmental Systems Research Institute (ESRI). Directions for installing the software have been provided. If you are not a West Virginia University student, you can still complete the exercises but you will need to obtain access to the software on your own.

If you have any questions or suggestions, feel free to contact us. We hope to continue to update and improve this course.

If you would like an introductory text on Web GIS in the ESRI environment, we would suggest Getting to Know Web GIS by Fu. We will also make extensive use of w3schools.com, the ArcGIS Maps SDK for JavaScript documentation and examples, the Leaflet JavaScript API documentation and examples, and the JavaScript Mozilla web documentation.

After completing this course you will be able to:

  • describe how the web works using client-server architecture.
  • produce an audience appropriate web map using ArcGIS Online.
  • publish data and maps for use in the web environment.
  • describe geospatial data formats for use on the web and when each is most appropriate.
  • solicit crowd sourced data using feature services to collect volunteered geographic information (VGI).
  • produce and publish a web map application using Instant Apps and the ArcGIS ExperienceBuilder.
  • develop multipage websites that are well styled and responsive using HTML, CSS, and Bootstrap.
  • add functionality to web pages and web maps using JavaScript and jQuery.
  • produce customized web maps using the ArcGIS Maps SDK for JavaScript and the Leaflet JavaScript API.

This course was produced by West Virginia View (https://www.wvview.org/) with support from AmericaView (https://americaview.org/). This material is based upon work supported by the U.S. Geological Survey under Grant/Cooperative Agreement No. G18AP00077. The views and conclusions contained in this document are those of the authors and should not be interpreted as representing the opinions or policies of the U.S. Geological Survey. Mention of trade names or commercial products does not constitute their endorsement by the U.S. Geological Survey.