Select to view content in your preferred language

Adding a "Zoom to" ability pop-ups in Story Maps

1980
2
Jump to solution
12-13-2018 05:33 AM
CatherineWargo
Occasional Contributor

I have a map that includes both county and tract level data: at larger scales only the county layer is visible and when you zoom in to the county-level the tract layers are visible. When I embed the map in a Story Map and click on a county there is no "Zoom to" hyperlink as there is on a standalone ArcMap; I want to recreate this hyperlink within my pop-ups so a user can click on a county then zoom to and center on that county to see the tract level information when viewing the map within a story map. I'd also like to add a hyperlink to tract level pop-ups allowing users to return to the map's extant, without having to manually scroll out again.

Are there ways to configure the pop-up box to provide a link within a pop-up for zoom in/out when the map is within a story map? Listing all the counties in the text box would take up too much space.

Tags (2)
0 Kudos
1 Solution

Accepted Solutions
RupertEssinger
Esri Alum

Hi Catherine,

It is possible to configure Story Map Series and Story Map Journal so that the popups in web maps have a 'Zoom To' icon that readers can click to zoom in on the feature, the same as the Zoom To link you see when you view a web map directly. You can do this by adding a CSS style tag into your story:

<style>
  .esriPopup .actionsPane {
   display: block !important;
 }
</style>

To do this in Map Journal, in the builder, go to the home section, and click the Edit button to start editing that section. In the side panel text editor's toolbar, click the Source icon (second button from the right in the top row of the toolbar). Paste the code above in at the top. Save and then view the story.

To do this in Map Series, in the builder, go to the first tab. In the description panel editor's toolbar click the Source icon (second button from the right in the top row of the toolbar). Save and then view the story.

This will apply to all the web maps in your Map Journal or Map Series, so you don't need to add that code to every section. The section you add the code to doesn't have to contain a web map.

 

After using the zoom to button in a popup, your readers would have to just click the Home button in the web map to go back to full extent. So it is the same behavior as a viewing a web map outside of a Story Map. 

Hope that helps.


Rupert

View solution in original post

2 Replies
RupertEssinger
Esri Alum

Hi Catherine,

It is possible to configure Story Map Series and Story Map Journal so that the popups in web maps have a 'Zoom To' icon that readers can click to zoom in on the feature, the same as the Zoom To link you see when you view a web map directly. You can do this by adding a CSS style tag into your story:

<style>
  .esriPopup .actionsPane {
   display: block !important;
 }
</style>

To do this in Map Journal, in the builder, go to the home section, and click the Edit button to start editing that section. In the side panel text editor's toolbar, click the Source icon (second button from the right in the top row of the toolbar). Paste the code above in at the top. Save and then view the story.

To do this in Map Series, in the builder, go to the first tab. In the description panel editor's toolbar click the Source icon (second button from the right in the top row of the toolbar). Save and then view the story.

This will apply to all the web maps in your Map Journal or Map Series, so you don't need to add that code to every section. The section you add the code to doesn't have to contain a web map.

 

After using the zoom to button in a popup, your readers would have to just click the Home button in the web map to go back to full extent. So it is the same behavior as a viewing a web map outside of a Story Map. 

Hope that helps.


Rupert

CatherineWargo
Occasional Contributor

Thank you!

0 Kudos