Legends in ArcOnline maps

[KeithHenderson]

When I create map using ArcOnline and then copay and paste code into my webpage to add the map, the legend does not automatically stay open.  Is there a way to force the legend to stay open so that unfamiliar users do not have to figure out what icons mean in order to view a legend?

[AdrianWelsh]

Hi Keith,

Is it safe to assume you are using JavaScript? It might be best to move this thread to ArcGIS API for JavaScript​ (or something more suitable).

There is a thread I came across once that mentioned adding a legend to a shortlist story map:

Legend Plugin for Shortlist Story Map

Not sure if that helps or not. It looks like this sandbox code has the legend open automatically:

ArcGIS API for JavaScript Sandbox 

[KeithHenderson]

Thanks Adrian.

Unfortunately, I am such a novice that I can’t answer your question. We have a super-basic (rather lame) web page editor and while I believe it may be Java based, I’m not sure.

Is it possible that I could pull in portions of the “sandbox code” you sent and use that to modify the code that is automatically generated by ArcOnline?

Keith Henderson, PP, AICP

[KeithHenderson]

Thanks Ricky. I got the same response from Adrian. We are forced to use a really crappy web page editor called TeamSite and I have pretty limited abilities to do anything too fancy there. I’m pretty sure that the behind the scenes stuff is Java based but I can’t be 100% certain.

I want to play with the sandbox code you and Adrian sent to see if I can pull a few lines from it and insert that into the code that ArcOnline generates for pasting into web pages.

Keith Henderson, PP, AICP

[KellyHutchins · Accepted solution]

Keith Henderson​ it sounds like you are using the embed option in ArcGIS Online is that correct? If so you can try appending a url parameter to the end of your src string that sets the panel open by default.

Here's an example showing this - note that the updated bit is the portion show in aqua.

<style>.embed-container {position: relative; padding-bottom: 80%; height: 0; max-width: 100%;} .embed-container iframe, .embed-container object, .embed-container iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%;} small{position: absolute; z-index: 40; bottom: 0; margin-bottom: -15px;}</style><div class="embed-container"><iframe width="500" height="400" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" title="TestTrailMap" src="//jsapi.maps.arcgis.com/apps/Embed/index.html?webmap=0f15c61bf4e345198e906933b9b9cdd3&amp;extent=-105.4144,39.934,-105.067,40.1175&amp;zoom=true&amp;scale=true&amp;details=true&amp;legend=true&amp;active_panel=details&amp;disable_scroll=true&amp;theme=light&show_panel=true&popup_sidepanel=true;"></iframe></div>

There is one small bug with this issue in that if your initial display size is small (500x400) the panel will not open by default. We will get this fixed for the next release.

[KeithHenderson]

OK. Thanks. I’ll try that.

Keith Henderson, PP, AICP

[KeithHenderson]

Didn’t work (yet). I’ll keep trying. I even set my display size to 650 X 695

I’m not an HTML Geek (but wish I was) so forgive this stupid question… all of that &amp stuff? Is that an issue?

Keith Henderson, PP, AICP

[KellyHutchins]

Try setting the width to 850.

[KeithHenderson]

.embed-container .embed-container iframe, .embed-container object, .embed-container iframe small

I tried your suggestion and augmented with the red above but still nothing.

Keith Henderson, PP, AICP