Set extent for Story Map Journal

[ShelbyZelonis1]

Is there a way to set an extent at the beginning of a Story Map Journal and have that same extent apply to all of the maps in the journal? This extent would be user-defined and would change based on who is using the map, so a default extent that I define is not what I'm looking for.

For example.... in the Map Series template, a user can search for a place in the first map (effectively setting an extent), and the rest of the maps in that map series become set to that extent. I'd like to replicate this functionality in the Journal. The end goal would be something like this: Page 1, user types in area of interest, map zooms to that area (i.e., map extent is defined). Page 2, a different map is shown, but it automatically zooms to the extent set in Page 1. Same for Page 3, 4, etc.

Ideally I hope to do this with as little coding as possible, but please point me to whatever resources may be available.  Thanks!

[AdrianWelsh]

There may be a button in the settings for "Synchronize Map Locations". (though I know this is available for the 'tabbed map', not sure about the map journal). I would refer to Owen Evans​ 

[GregoryL_Azou · Accepted solution]

There isn't such a feature by design. Map Journal main goal was to help author present a crafted story where user should not need to navigate the map much. Unlike Map Series that was really designed to be good at the case you mention, also notice that unlike in Map Series there isn't a search function either.

But we have heard that request a couple of times and it's likely we will work on this, while we will keep the main pattern of Journal identical. In the mean time, you have one solution without customization that is to use only one map in your story and toggle layers visibility on and off depending on the section (set the location configuration to "Map default" in all sections). This can works really well if you have maybe less than 25 layers in your map (hard to give a number as it really depends on how much data each layer has). At some point, the Journal will be less responsive, the map will be significantly slower to load and the transition between sections will not be really smooth but it should still work.

If customizing is an option, you could certainly do something pretty quickly by using the API in index.html (https://github.com/Esri/map-journal-storytelling-template-js#developer-guide ), you would place listener on all map extent change and apply the extent to other maps (that's pretty much what Map Series is doing). One challenge is that the maps only load when user access a section, so not all maps will be loaded and when a map load, you will have to apply the proper extent, which will not look very good.

But you could go a little further by modifying the extent associated with a section before the section load, you can do that with something like (not tested)

$.each(app.data.getStorySections(), function(i, section) {
  if(section.media.type == "webmap") {
    section.media.webmap.extent = <the recent map extent change serialized in JSON>
  }
});

This should works really well. If all your maps are in the same projection, you should not see any difference. You can use app.map.extent.toJson() to serialize the current map extent in JSON.

The ultimate way to do this would be to modify the class that deal with that in the application map-journal-storytelling-template-js/MainStage.js at master · Esri/map-journal-storytelling-template... ; comparing it with the same class in Map Series would certainly help map-series-storytelling-template-js/MainStage.js at master · Esri/map-series-storytelling-template-j... . This is certainly a bit tedious as there is a lot going on.

Hope this helps and you succeed.

[ShelbyZelonis1]

Thanks very much, I will try this out.

[AprilChipman]

Could something like this customization work for not allowing a user to zoom or pan the map in Story Map Journal?

I have a story map setup using a webmap and each section turns on/off the appropriate layers. Everything works perfectly until a user tries to interact with the map and zooms or pans around. I want the map to not be interactive at all.

Thanks for any help!