Community
Select to view content in your preferred language

Allow for embedding of dashboard type elements in Story Maps content

924
2
04-21-2020 05:04 PM
Status: Implemented
AndrewDouglas-Clifford1
by
Occasional Contributor

It would be great to embed more things natively in Story Maps along the lines of indicators and graphs (such as those found in Dashboards) that could sit in to a story next to the linked map in the Sidecar view. For example, a graph that breaks down the map's data, an inline legend/feature popup, or indicators showing counts/statistics of map features shown.

An quick interim workaround could be to allow the embedding of 'mini' Dashboards in Sidecar's content area - this would allow for embedding (but not linked) dashboard counts/graphs to be added inline and sit alongside the main map - at the moment it is restricted to displaying it as a card only. Here's an example mocked up using a third party embedded graph:

Interactive Graph embedded in Story Map example

2 Comments
KateCarlson
by
‎06-11-2021 07:58 AM

Yes! I would love to add gauges and other simple Dashboards to a sidecar. 

Kate

OwenGeo
by Esri Notable Contributor
‎02-22-2025 05:01 AM
Status changed to: Implemented

In Dec 2024, the ability to create charts was added to ArcGIS StoryMaps. As of February 2025, charts can be added to sidecar narrative panels. For more information, see What's new in ArcGIS StoryMaps (December 2024) and Including charts in ArcGIS StoryMaps. 

Additionally, you can add ArcGIS Dashboards to sidecar narrative panels. Dashboards with a mobile view look best in a sidecar panel since they are designed for a smaller space. The dashboard author must design and configure a mobile view. For more, see Getting started with dashboard mobile views.

Even if a dashboard has a mobile view, you may not get the result you expect if you embed it in a sidecar narrative panel using the standard dashboard link; however, you can easily refine its appearance by embedding it using iframe code to:

  1. Force the mobile view to display (using the view URL parameter)
  2. Set an appropriate height for the dashboard . Be sure to specify a width of 100% when setting a custom height.

Below is the format of the code you'd use to do this:

<iframe src="https://[my-dashboard-url]#view=mobile" width="100%" height="700px" />

 

You may need to experiment with the height to find what works best for your dashboard. This will require removing and re-adding the dashboard since you are unable to edit embed code once it's added.

For more tips for improving embedded content in stories, see Enrich your stories with embedded web content.