I'm using v4.27.6 and, no matter how I try to insert the images, as long as they're base64, the img gets their src totally cleaned up
let businessGallery = '';
if (this.searchResultsGalleries[element.id] != undefined) {
this.searchResultsGalleries[element.id].forEach(element2 => {
businessGallery += `
<div>
<img src="${element2}"/>
</div>
`;
});
}
// ...
element.graphic = Maps.AddPoint({
longitude: mapPoint.longitude,
latitude: mapPoint.latitude,
attributes: {
title: '',
description: `
<div class="content-gallery ${businessGallery == '' ? 'd-none' : ''}">
${businessGallery}
</div>
`
}
});
In the DOM it looks like this:
I already confirmed businessGallery has actual data for their images so much so that you can see the dots corresponding to each image that it was supposed to be displayed (8 in total).
I read somewhere this was some sort of bug, in arcgis 3 this simply worked fine so I don't really know what to try to make it work on 4 as well.
Appreciate any help
This can be accomplished via CustomContent for the PopupTemplate. The ImageMediaInfo is probably the cleanest way to do it for images. Here is a blog post on pulling images from a third-party API that might help too.