Hello all!
I am struggling with adding Arcade to a simple custom div popup in a javascript 4.x build? should be simple?
the Arcade script works within an AGOL mapview, but I must be missing something trying to add it to my js. I am accessing the FeatureLayer directly, independent of a mapview.
actually, I am having trouble adding 'anything' to the div beyond simple html text.
I am trying to get the contents of a source Field to show in the div 'popup', and it does not recognize "$feature". The actual Arcade is somewhat irrelevant, it's the process of getting the js to recognize the Arcade statement, and getting that output into the html div.
This is actually a popup that is triggered by a Sources click inside an existing popupTemplate. see screenshot and pieces of the code below-
*THE POPUP*
<div id="popupSources">
<p>Links to Sources</p>
<button class="popupSourcesClose" onclick="closePop()">
<p>Close</p>
</button>
</div>
<script>
function closePop() {
const popClose =
document.getElementById(
"popupSources"
);
popClose.style.display = "none";
}
function openPop() {
const popOpen =
document.getElementById(
"popupSources"
);
popOpen.style.visibility = "visible"
popOpen.style.display = "block"
console.log("OPEN")
}
</script>
*THE ARCADE*
<script>
var feat = $feature.DataSourceID
var table = FeatureSetByName($datastore, "GHS_DataSources_DataRelease_v1_Service", ['DataSources_ID', 'URL'], false)
var arr = Split(feat, " | ")
var output = []
for (var index in arr) {
var dsource = arr[index]
var pub = Filter(table, "DataSources_ID = @dsource")
var link = `<a href="${First(pub).DataSources_URL}">${dsource}</a>`
Push(output, link)
}
return {
type : 'text',
text :
`
<b>Data Source:</b> ${Concatenate(output,' - ')}<br><br>
`
}
</script>
