Displaying an image returned by an integration object as binary for each row in a grid

I have an integration that queries for a single image based on an ID, and returns a response body with the image as binary: 

I need to get and display an image for each item in a read only grid using the integration.  Is there a good way to do this?

First I updated the integration to convert the binary photo to an Appian document, that I can then query: 


However, I cannot figure out how to automatically run the integration object on each row.

One workaround that might be acceptable to my users is to have them click a link to see an image for a specific row.  However, whenever I query an image for a specific row, it populates all rows with the same image.  Here is my code:

a!gridField(
  label: "Read-only Grid",
  labelPosition: "ABOVE",
  data: rule!RTI_RULE_GENERAL_index(
    item: local!realData,
    indexArray: { "assets", "attributes" }
  ),
  columns: {
    a!localVariables(
      local!imageResultForRow,
      {
        a!gridColumn(
          showWhen: rule!RTI_RULE_GENERAL_isNullOrEmpty(local!imageResultForRow),
          value: a!buttonArrayLayout(
            showWhen: rule!RTI_RULE_GENERAL_isNullOrEmpty(local!imageResultForRow),
            align: "CENTER",
            buttons: {
              a!buttonWidget(
                label: "Get Model Image",
                saveInto: {
                  rule!POC_getPhotoByAssetIDAndPhotoType(
                    token: "xxxxxxxx",
                    catalogue: "yyyyyyyyyyy",
                    asset: rule!RTI_RULE_GENERAL_indexWhere(
                      initialArray: rule!RTI_RULE_GENERAL_index(
                        item: local!realData,
                        indexArray: { "assets", "attributes", "Model" },

                      ),
                      finalArray: rule!RTI_RULE_GENERAL_index(
                        item: local!realData,
                        indexArray: { "assets", "id" }
                      ),
                      value: index(fv!row, "Model", {})
                    )[1],
                    photoType: "thumbnail",
                    onSuccess: {
                      a!save(local!imageResultForRow, fv!result.body)
                    },
                    onError: {
                      a!save(
                        local!imageResultForRow,
                        fv!result.statusCode
                      )
                    }
                  )
                }
              )
            }
          )
        ),
        a!gridColumn(
          showWhen: not(
            rule!RTI_RULE_GENERAL_isNullOrEmpty(local!imageResultForRow)
          ),
          value: a!imageField(
            size: "LARGE",
            images: {
              a!documentImage(document: local!imageResultForRow)
            }
          )

        )
      }
    )
  },
  validations: {}
),


So my questions are:

  1. How can I use this integration to query and display an image for each row in a readonly grid automatically on page load?  Is there any way to do this without having to save a document of each image in Appian?
  2. OR, how can I click a button and display the image just for an individual row

  Discussion posts and replies are publicly visible