ArcGIS StoryMaps

Media layers & ArcGIS StoryMaps: a treasure trove of possibilities

It was a (probably) dreary Thursday morning in February of 2023 when I heard the news. Immediately the clouds parted, the sun beamed down, and trumpets sounded from on high. “Listen, ye storytellers, and rejoice,” (or something to that effect) announced Mark Harrower, a Senior Product Engineer for ArcGIS Map Viewer. “I bring tidings of the media layer.

Okay, so maybe it didn’t happen quite like that, but this was still a game-changing event for anyone who authors stories with ArcGIS StoryMaps. So what does a new Map Viewer feature have to do with our ability to tell engaging, interactive stories about the world? Well, as it turns out, quite a bit.

 

What is a media layer, anyway?

Map Viewer, as most people reading this likely know, is Esri’s ArcGIS app for authoring web maps, whether they’re complex projects imported from ArcGIS Pro or brand new maps from scratch. Typically, web maps are built by bringing in layers of features or other geospatial data. Map Viewer’s February 2023 update introduced a different type of layer, however: the media layer.

 

A screenshot of the layer panel in ArcGIS Map Viewer, with the add layer dropdown menu open and the media layer option highlighted

 

The media layer allows authors to pull an image directly into a web map—not as part of a pop-up, but into the actual map itself, as its own layer—and position it anywhere in the world. What this means when it comes to ArcGIS StoryMaps is that anything you can do to a map, you can now do to an image by adding it to a web map and bringing that web map into a story. Still not sure why this is so exciting? Let’s look at some of the previously map-only techniques that can now be applied to images in ArcGIS StoryMaps.

 

Anything maps can do, images can too

Image tours

We’ll start with one of the most popular features in ArcGIS StoryMaps: map tour. In a map tour, storytellers set up a sequence or array of geographic points that relate information and media about each place as readers are guided through or given license to explore them. But what if you could have an audience experience that curated tour of an image instead of a map? That’s precisely what the media layer now allows.

In the story The golden view, a panoramic photo of the skyline of Pittsburgh is used as the base for an explorer tour in lieu of a map. Rather than representing points on a map, each point in the tour represents an element of the photo—a towering skyscraper or a nearly-hidden historic site, for instance. Readers can embark on a self-guided “tour” of the photo, clicking the pins on the elements of the skyline that interest them the most to learn more about them.

 

An animated gif demonstrating how media layers can be used in an explorer map tour in ArcGIS StoryMaps
A demonstration of how a media layer can be used as the base for an explorer tour in ArcGIS StoryMaps.

 

Image choreography

Another feature of ArcGIS StoryMaps that the we on the StoryMaps team are really enthusiastic about is map choreography: the ability to stage a series of maps in sidecar slides that change in some way (exposing layers, changing extent, etc.) as a reader scrolls from slide to slide.

Returning to Pittsburgh and The golden view, you can see an example of image choreography, now possible thanks to the Media Layer. Sequences of slides involve a web map that has multiple images uploaded into it, each depicting the Pittsburgh skyline, but across three different periods of time. By turning these media layers on and off as the reader scrolls, they can watch the city transform from the same vantage point over the span of a century, before their very eyes.

 

An animated gif demonstrating how image choreography can be set up using a sequence of slides with media layers
Media layers can be used to enact image "choreography," too.

 

Image actions

One more fun trick that can now work on images is map actions. These are clickable buttons or bits of text in map-occupied sidecar slides that change the appearance of the map when activated, again by turning layers on or off and/or panning/zooming.

The story Quizzed from above presents ten photographs taken from airplane windows somewhere over the continental U.S. These snapshots are media layered into a web map so that “map” actions within the accompanying text can point out various context clues that might help a reader key in on the photo’s location. A final map action reveals an annotated screenshot from Esri’s world imagery layer that provides the answer.

 

An animated gif demonstrating how map actions can be set up with images using the media layer
Image "actions" can add interactivity to images when they're brought into a story using the media layer.

 

Just think of the possibilities!

Those two example stories show off some fun, whimsical ways that the media layer can be used in conjunction with ArcGIS StoryMaps features and techniques, but the full range of possibilities starts to feel nigh on endless once our imagination kicks in. Just off the top of my head, here are a few other ideas for how to incorporate media layers into ArcGIS StoryMaps.

Historic/scanned maps

A lot of the time we’re spoiled by living in a digital age; we can usually find all manner of archival materials online in a matter of seconds, including historical maps (obligatory shout out to the Rumsey Collection). But that just makes it even more frustrating on those occasions when we find ourselves in possession of cartography that’s digitized (or able to be digitized) but not georeferenced. Fortunately, now we have the media layer to evaporate that frustration.

Schematics/graphics

Maps come in all shapes, sizes, and scales. You could even have a map of a studio apartment—it’s called a floor plan. Use the media layer to set up a digital tour of an indoor space. Or, heck, let’s get totally heretical: You don’t even need to involve place at all! Walk through a flow chart or instruction manual or family tree in ArcGIS StoryMaps.

 

An illustration of a school cafeteria kitchen, with green pins indicated different pieces of kitchen equipment
In the story "Picking apart the school lunch," an illustrated view of a school kitchen brought into a media layer provides insight into the difficulty and expense of maintaining kitchen equipment.

 

Artwork

While I’m heading down this very dangerous road of placelessness (please don’t tell anyone), I might as well toss out the suggestion of using media layers to “deconstruct” a work of art like a painting, say, or a more human-oriented photograph.

In the story Answering the call, about wilderness safety and rescue, we pulled an illustration into a media layer and then used it as the “basemap” for a guided tour that walks through some essentials for long hikes.

I’m sure you could come up with dozens of other potential use cases, and I’m super excited to see what our storytelling community comes up with!

 

Media layer tips and tricks

A beautiful simplicity

Before the advent of the media layer, there technically was a way to trick GIS software into “georeferencing” an image, after which you could theoretically employ the techniques outlined in this post. However, this was a multi-step process that required access to and some knowledge of GIS software; in other words, the barrier to access was just a little too high to make it part of a regular storytelling workflow for most people.

One of the best things about the media layer is that literally anyone with an ArcGIS Online account can do it in four clicks or fewer: One click to open your map’s Layers tab (if it isn’t open already), one to unfurl the Add drop-down menu, and a third to select Add media layer. The final click is used to drag in your desired image (for now, just JPG and PNG files up to 10 megabytes), and watch it appear on the map.

 

An animated gif demonstrating how to add a media layer in map viewer
Adding media layers to map viewer is incredibly simple.

 

When you first add an image, you’ll be inside the media editor, where you can place, resize, rotate, and stretch the media. You can also adjust the image’s transparency while you wrangle it into shape, which can be especially helpful for lining up a historic or scanned map with the underlying basemap. (Note that transparency within the media editor does not apply to the actual appearance of the layer in the map; layer transparency can be adjusted in the layer properties. Also, you can reenter the media editor at any time by clicking Edit placed media in the layer properties.)

Hide the basemap

There may be instances when the basemap is only going to be a distraction from the presentation of the media layer(s) in your story, but there are a few options to “hide” it. The easiest is to simply turn off the basemap layers entirely, then enabling background color in the Map properties and setting that color to whatever you’d like the background to be (useful for making media layers appear seamless against the background of a custom theme, as in the Quizzed from above story).

 

An animated gif demonstrating how to hide the basemap and give the background a new color in map viewer
Map viewer makes it easy to hide the basemap, which can help keep the focus on your media layers.

 

If you know you’re still going to want to display the basemap at times—for example, to provide locational context for a photo, or to compare a historic map with the present-day environment—you could try adding the ready-made “Blank White Vector Basemap” or “Blank Black Vector Basemap” from the Living Atlas layer repository and toggle it on or off to cover or show the basemap as need dictates. If pure white or black doesn’t jive with your theme, you can always draw your own sketch layer that encompasses the entire earth, make it fully opaque, and give it whatever custom color you want.

 

 

We’re just getting started

The ideas laid out in this post are only scratching the surface of what’s possible. There are plenty more options and approaches to try, both within ArcGIS StoryMaps as well as on the Map Viewer side.

You could bring the image layer into the basemap group so it will show up in an express map, opening up elements like the drawing tools and text annotations that express maps allow.

You could play around with scale dependency, making it so images only show up when you drill down to the largest scales, e.g., a photo of a particular storefront appears upon zooming into the street level on the map (credit to Mark Harrower for this idea).

You could experiment with other Map Viewer tools like sketch layers or bloom effects to call attention to certain parts of the image before you even pull it into the story. (Check out this blog post for one such workflow.)

The best thing about this wonderful storytelling community is that if we haven’t thought of it or tried it, you certainly have, or will! Please keep us in the loop as you come up with clever ways to combine media layers with ArcGIS StoryMaps. Give us a shout on Twitter @ArcGISStoryMaps and show off what you’ve been working on. We can’t wait to see what creative stories you’ll be able to tell!

_____________________

Blueprint schematic photo by Anastasiya Bleskina, © Adobe Stock, all rights reserved.

About the author

Will (he/him) is a Senior Content Specialist on the StoryMaps editorial team. A yinzer born and bred, he is an aficionado of two-lane road trips, Minor League Baseball, malt-forward beer, or any combination thereof.

0 Comments
Inline Feedbacks
View all comments

Next Article

Multi-Scale Contour Styling in ArcGIS Pro

Read this article