Employee Blog

The Haunted Birmingham Alabama Story Map – Part Two

The Haunted Birmingham Alabama Story Map – Part Two

Published October 30, 2013 by Lori Page

As I mentioned in part one of our series, I’m new to GIS, Esri technology, and everything geospatial. Researching haunted places? Piece of cake. Taking pictures of haunted places? So easy! Working with ArcGIS Online as a first-time user to put all of my research, images, and coordinates into a story map with a custom basemap? That was going to be a bit more of a challenge. Luckily for me, I work with some folks who know this stuff backwards, forwards, sideways, upside down, and underwater. And because they love it so much, they didn’t hesitate to give me a hand when there was something I was trying to figure out how to do. Not that it was too terribly complicated but I definitely wanted to make sure I was doing it all correctly. I went about my story map creation in the most non-technical way ever and, in hindsight, should have taken advantage of some of the available resources on the Esri website.

I started with a spreadsheet

In order to have your locations show up on the map, you need their coordinates. Somehow I managed to find the coordinates for each of my haunted locations using various web sources online. It’s pretty easy to do as long as you have an address for each location. If there was an easier way to do it, I didn’t spend a whole lot of time looking for one at the time. The main thing for me (then) was that they were accurate, and they were. I entered my story map points into an Excel spreadsheet as well as the descriptions that go along with each location.

points spreadsheet


Working with Esri ArcGIS Online (AGOL)

With all of my location information prepared and ready to go in my spreadsheet, I logged into ArcGIS Online and started working on my story map. Although it wasn’t clear to me how it all worked at first, in order to create your story map, you start with a web map available to you in AGOL. I originally selected the imagery basemap (a satellite imagery view), but later changed my mind (more on that in a moment). When you’ve selected the map you want to use, you save it, share, and publish the map as an app. When you publish it as an app, you can choose which story map template you want to use. I chose to go with the  “Storytelling Map Tour Template” as it seemed to be the best format for how I wanted to present my haunted locations.

So back to my issue with the satellite imagery basemap I originally chose. I thought it was definitely cool but it lacked the whole spooky feel that I wanted to show through in my story map. I needed an artist. Or a cartographer to be exact.

The the spooky customized basemap

My colleague, Jonah Adkins, was just the man for the job and he was very helpful with the customized basemap. The first thing he asked me to do was to find some inspiration for a color scheme. I sent him this and he used the colors as inspiration for our map. The second thing he needed were the coordinates for all of my points. I knew he was up to something awesome…but I didn’t know what. I felt a bit like Igor assisting Dr. Victor Frankenstein in the creation of a monster – but not an “abby normal” monster of course.

Jonah loves TileMill and that’s pretty much where he went first to customize the basemap. Once he had all of my location points, he began styling the map with Carto-CSS. When he was comfortable with the overall look, he uploaded the tiles into his free Mapbox account. Normally he would have used ArcGIS Desktop but since he didn’t have access to ArcGIS For Server or an organization level ArcGIS Online account, he went with Mapbox instead. It also helped that he was only customizing a small area of the map, otherwise it would have required more heavy-duty resources.


To incorporate the map into our story map, Jonah walked me through the steps I needed to take to get it running. First I logged into my ArcGIS Online account and opened a web map. Then I went to Add > Add Layer from Web > A Tile Layer. In another browser tab, I had my map open in its web map form. With my browser I had the option to use the ‘Inspect Element’ feature to get the URL for the tile layer we were using. Then it was just a matter of using the URL pattern to fill out the URL in the tile layer dialog box.

map edits

We made a few changes:

  • Replaced the first letter, usually a,b,c, or d with {subDomain)
  • Replaced the level, column, and row numbers with {level}/{col}/{row}
  • Made sure to include the .png on the end
  • Checked the basemap box
  • Under subdomains, we inserted the a,b,c,d under Subdomains.
  • Used the ‘Set Tile Coverage’ to our designated parameters.

Finally, I hit the Add Layer button at the bottom and that pretty much did the trick.

Once we completed the custom basemap, I shared it as a Web Mapping Application (using the Storytelling Map Tour Template), went to the application under “My Content” in AGOL, selected “Switch to builder mode”, added my tour points and location descriptions one-by-one, and added a slime-green version of our GISi logo to the header area. I changed the theme colors to mostly black and made my tour points green.

In terms of the whole story map creation process within ArcGIS Online, now that I’ve done it once, future story maps will be a lot easier. It took some time to learn where things were and how all the pieces fit together, but at least I can now do the basic things. And in a weird way it was kind of neat earning my very first GIS stripe – with a little help.

Share this:

Comments are closed.