5

In ArcGIS Online popups how does one display attached images inline as an image instead of just a link? In case of multiple images I'm okay with just first one showing inline.

Under "Configure Popup" checking " Show feature attachments as links" results in text-only links. If the "Pop-up Media" control is used to add an image, it shows inline, however one has to know the URL ahead of time. The drop down selector does not show attachments as a possibility.

Showing attached images as text only links

Attachment attribute not listed

Desired result

Popup showing 1st image inline, hidden beneath fold are rest of attachments as links.

popup showing 1st image inline

5

Going through the same difficulty, I found a semi-automated solution that works as following:

  1. The popup is opened and the attachment urls load and appear as links.
  2. A placeholder image (an arrow in my case) is loaded where the image will soon load.
  3. Clicking the placeholder retrieves the url from the attachment link and replaces its own source url with the retrieved url, making the attachment image show.

To make it work, put the following values in the popup image configuration:

  • URL: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAHCAIAAABV+fA3AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADJJREFUeNpi+I8KFi1aBGczMWCAxYsXQxhY5ODS2OUg0jjlYmNjmXBJYDcTIgEEAAEGAGysItsbwoS/AAAAAElFTkSuQmCC (this is just an inline image of an arrow: you can replace it with any other url.
  • Link: javascript:void(document.getElementsByClassName("esriViewPopup")[0].getElementsByTagName("img")[0].src = document.getElementsByClassName("esriViewPopup")[0].getElementsByTagName("a")[0].href); this makes the link run a javascript code that makes the (first) attachment link become the image's URL.

Hope this helps.

  • how can I do this without a dev edition web app. – NULL.Dude Feb 8 '18 at 13:54
1

I guess a potential workaround that would add a couple steps to your workflow would be the following:

  1. Add text field [ATTACH_URL] (255 char) to the attribute table of the feature layer
  2. Create a new point and upload the attachment
  3. Click on the popup, then right-click and ‘Copy link address’ from the link to the attachment
  4. Edit the feature, and paste this URL into the [ATTACH_URL] field enter image description here
  5. Configure the popup, and under Pop-up Media, click ADD>Image
  6. Configure the popup as the following: enter image description here

You would then have to repeat steps 3-4 every time you publish a new feature.

Not ideal or automated, but possible.

1

Here is a helpful GP tool that will add attachments to a pop-up:

https://geonet.esri.com/docs/DOC-7445

We're looking for long answers that provide some explanation and context. Don't just give a one-line answer; explain why your answer is right, ideally with citations. Answers that don't include explanations may be removed.

  • Please, don't post a link-only answer. Links can be lost in a future. You can add steps or highlights in your answer – aldo_tapia Sep 26 '17 at 12:06
  • Hi Jake, please take a look here – bummi Nov 17 '17 at 16:22
1

Another alternative is to use the new Operations Dashboard and add your web map to it. Pop-ups in the dashboard map will display all the images attached to a feature by default like in the image below:

enter image description here

0

The best way to do this is to use the "Pop-up Media" option under the "configure Pop-up" dialog within ArcGIS online for the layer you want to work with.

For the URL config you want to substitute 2 parts of the URL with {OBJECTID} like this bellow :

https://your.portal.url/server/rest/services/service_folder/service_name/MapServer/0/{OBJECTID}/attachments/{OBJECTID}?

This should give you the nice clean output you are expecting.

  • If you try this, I suggest using a different field, objectIDs are notoriously unstable. – JMers Jun 11 at 16:39

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.