In this course, we'll be spending the bulk of our time learning how GIS web applications can be built using a mapping Application Programming Interface (API) created by Esri in combination with the core web development technologies of HTML, CSS and JavaScript. However, before digging into those programming languages and that API, it's worth noting that Esri also provides non-programming tools for creating mapping apps. These tools don't provide the same level of control over the final product as one developed using code written on top of the API, but they might meet some of your app development needs. And as we'll see later in the course, a smart workflow is to use tools in ArcGIS Online to handle certain parts of the app development (layer symbology, popup window content, etc.) and develop the rest of the app through coding.
At the successful completion of this lesson, you should be able to:
Conversation and comments in this course will take place within the course discussion forums in Canvas. If you have any questions now or at any point during this week, please feel free to post them to the Lesson 1 Discussion Forum. (That forum can be accessed at any time by clicking on the Discussions tab within Canvas.)
Lesson 1 is one week in length. (See the Calendar in Canvas for specific due dates.) To finish this lesson, you must complete the activities listed below. You may find it useful to print this page out first so that you can follow along with the directions.
Step | Activity | Access/Directions |
---|---|---|
1 | Work through Lesson 1. | You are in the Lesson 1 online content now. The Overview page is previous to this page, and you are on the Checklist page right now. |
2 | Create a mapping app of your own choosing using Esri's Web AppBuilder or one of their configurable templates. | Post a link to your app in the Lesson 1 Discussion Forum. |
3 | Review another web mapping platform. | Post a link to your video review in the Lesson 1 Discussion Forum. |
4 | Take the Lesson 1 Quiz after you read the online content. | Go to the Canvas Homepage and click on the "Lesson 1 Quiz" link to begin the quiz. |
Several GIS technology vendors provide the means for nonprogrammers to create web maps without writing any code (e.g., Google's My Maps, CartoDB, ArcGIS Online), and the capabilities of these map authoring applications are increasing constantly. In this part of the lesson, we will explore Esri's ArcGIS Online.
In this section, we've been able to build a useful interactive web map without any programming. Move on to the next page to see how to take your ArcGIS Online map further -- still without programming -- by embedding it within a web page and using it as the basis for a web application.
The map created earlier in the lesson offers interactivity in the form of zooming in/out, toggling layers on/off, accessing information about map features by clicking on them, changing the base map, etc. This part of the lesson will begin by showing you how to embed your map within a separate web page. After that, we'll look at tools developed by Esri that make it possible to incorporate even more interactivity -- to turn your map into an app.
While it's sometimes preferable to share the link to your map -- allowing it to fill the viewer's browser window -- it can also be useful to embed the map within a page of content.
The interactivity offered by this map is nice, but you may find yourself in situations where you need to go further. For example, maybe you want end users to be able to query the map's underlying data for features meeting certain criteria or to be able to edit the underlying data. Esri offers a couple of different non-programming options for those looking to build apps with greater functionality. The first of these is a set of templates that each meet a narrowly focused need (e.g., Edit, Query, Directions). As the app developer, you select the desired template and make a relatively small number of configurations to tailor the app to your needs. The second option is to use Web AppBuilder. This option is more open-ended, allowing you to build a less narrowly focused app by picking and choosing from a set of widgets.
We'll start with configurable app templates and to demonstrate their use we'll create an app for locating buildings on the Penn State Main Campus.
Remember that there are many configurable app templates available to you as an app developer. Often there are multiple templates that can serve as logical starting points, and depending on the widgets employed by the template, you'll see different customization options. For example, this building finder app could have been built using the Public Information template. If you have extra time after completing this lesson, you might want to experiment with building an app from that template.
Now let's try Esri's more open-ended option for creating apps.
With that, you've built a couple of apps that could be used in real-world scenarios. Best of all, you didn't have to write a line of code. One thing I hope you'll take away from this exercise is to remember that these no-coding tools exist and to look for opportunities to take advantage of them.
Move on to the next page of the lesson to solidify what you've learned here with an assignment that requires you to build another app using data and requirements of your own choosing.
With that, you've finished working through the content on developing geospatial apps without programming. For some of you, especially those who work in an organization with an ArcGIS Online account, what you've learned in this lesson will sufficiently meet your app development needs. However, if you find that the available widgets can't quite be added together to form the app you want, you'll need to learn about web programming technologies. In the next lesson, you'll learn about HTML and CSS, languages that are used to define the content and presentation style of web pages. With that foundation laid, you'll be ready to spend the rest of the course learning about Esri's JavaScript-based Application Programming Interface (API), which provides developers a finer level of control over their apps than is possible with their non-programming options.
Links
[1] http://pennstategis.maps.arcgis.com/
[2] https://www.e-education.psu.edu/geog260/sites/www.e-education.psu.edu.geog260/files/image/webappimages/jb_data.zip
[3] https://www.e-education.psu.edu/geog260/sites/www.e-education.psu.edu.geog260/files/image/webappimages/lesson1_embed.html
[4] http://pennstategis.maps.arcgis.com
[5] http://maps.pasda.psu.edu/arcgis/rest/services/pasda/PSU_Campus/MapServer/1
[6] https://www.e-education.psu.edu/geog863/sites/www.e-education.psu.edu.geog863/files/psu-facebook-avatar-180x180.jpg
[7] http://www.psu.edu.
[8] http://doc.arcgis.com/en/web-appbuilder/create-apps/widget-overview.htm
[9] http://www.psu.edu