Resize image attachments using Arcade in the ArcGIS Online Map Viewer pop-ups

Summary

Reducing the resolution of image attachments is necessary to improve storage efficiency and reduce data usage for an enhanced user experience. This article provides the workflow to resize image attachments using an Arcade expression in the ArcGIS Online Map Viewer pop-ups.

Procedure

1. Log in to ArcGIS Online and click Content > My Content.
2. Navigate to the hosted feature layer with the image attachments and add a new integer field. Refer to ArcGIS Online: Add a field for instructions. In this example, the new field is named AttachID.
3. Calculate the values for the newly added field from the item page using an Arcade expression. Refer to ArcGIS Online: Calculate values for a field from the item page for instructions.
4. In the Expressions box, specify the following expressions.

First(Attachments($feature)).ID

5. On the Overview tab of the hosted feature layer, scroll down and copy the link from the URL section. Paste the link in a notepad.
6. Configure the pop-ups for the image attachments using an Arcade expression.
   1. On the Overview tab, click Open in Map Viewer.
   2. On the Settings (light) toolbar, click Pop-ups.
   3. In the Pop-ups pane, click Add content > Arcade.
   4. In the Expression box, specify the following expression. Replace the necessary variables of the feature layer.

Note:
Image attachments in non-public layers require an authentication token, which expires over time and may cause images to become inaccessible.

var Part1 = "<URL in step 5>/";
var ObjectID = $feature.OBJECTID;
var Part2 = "/attachments/";
var AttachID = $feature.AttachID;

//include this line for the non-public layer:
//var token = "<tokenID>"

var link = Part1 + ObjectID + Part2 + AttachID

//use this line for the non-public layer:
//var link = Part1 + ObjectID + Part2 + AttachID + token

var imageLink = `<img src = "${link}" width ="%">`

return {
type: "text",
text: imageLink
};

7. Click Run to preview the expression result. If the required result is achieved, click Done.

The image below shows the resized image attachment in the Map Viewer pop-up.