Mostrar un archivo de sonido específico como una ventana emergente en ArcGIS Online basado en una variable

Question

Estoy tratando de configurar una ventana emergente en un mapa web en ArcGIS Online (Organización). Quiero que la ventana emergente muestre un pequeño reproductor de audio que apunte a un archivo mp3. Quiero que el archivo mp3 cambie dependiendo de la característica seleccionada en el mapa por el usuario.

Tengo un conjunto de datos de un solo punto con un solo campo "Especies". Tengo una lista de valores asignados a este campo de alrededor de 40 especies diferentes. También tengo un archivo mp3 para cada una de las 40 especies.

Mi idea era que podía utilizar una sentencia if/else para seleccionar qué archivo mp3 debía aparecer en la ventana emergente.

Para crear la ventana emergente, estoy creando una pantalla de atributos personalizada.

{Species} was heard here
    <br />
    <br />
    <audio controls=""> <source src="https://www.xeno-canto.org/sounds/uploaded/XTVEPHMPPJ/Haematopus_leucopodus_1984_02_04e.mp3" type="audio/mpeg"></source> </audio>

El código anterior funciona para que aparezca un jugador

También puedo añadir un segundo jugador a la ventana emergente como se indica a continuación

{Species} was heard here
<br />
<br />
<audio controls=""> <source src="https://downloads.esri.com/agol/labs/maptour/horse.mp3" type="audio/mpeg"></source> </audio>
<br />
<br />
<audio controls=""> <source src="https://www.xeno-canto.org/sounds/uploaded/XTVEPHMPPJ/Haematopus_leucopodus_1984_02_04e.mp3" type="audio/mpeg"></source> </audio>

Esto hace que aparezcan 2 reproductores de audio dentro de la ventana emergente.

Pero no puedo elegir el archivo basado en la variable {Especie}.

Intentar hacer una declaración if/else

{Species} was heard here
<br />
<br />
IIf($feature.Species=="Egret". "<audio controls=""> <source src="https://downloads.esri.com/agol/labs/maptour/horse.mp3" type="audio/mpeg"></source> </audio>", "<audio controls=""> <source src="https://www.xeno-canto.org/sounds/uploaded/XTVEPHMPPJ/Haematopus_leucopodus_1984_02_04e.mp3" type="audio/mpeg"></source> </audio>

Vuelve a surgir esta ventana emergente:

También he intentado usar este código en una expresión de Arcade, pero ni siquiera puedo conseguir que se muestre un solo reproductor de audio.

Algo así como:

Si {Especie} = Cuervo Reproducir URL MP3 de cuervo Si {Especie} = Garceta Reproducir Garceta MP3 URL Else if {Species} = Petirrojo Play Robin MP3 URL

¿Alguien puede aconsejarme cómo puedo mostrar un único reproductor de audio en función del valor {Species} asignado al punto sobre el que el usuario ha hecho clic?

Answer 1

El paso clave es tener un campo con el nombre del archivo, o crear una expresión de atributo que tenga el nombre del archivo (o la URL completa), pero no el HTML completo.

Si tienes un campo con contenido que coincide con el nombre del archivo, es tan fácil como configurar la ventana emergente, elegir "Una visualización de atributos personalizada", y hacer clic en el icono de "Ver fuente HTML" y añadir:

<audio controls="">
    <source src="https://downloads.esri.com/agol/labs/maptour/{species_filename}.mp3"
    type="audio/mpeg"></source>
</audio>

Si no tienes un campo de este tipo, puedes crear una expresión de atributo que cree esa información en un campo virtual que puedes usar como arriba.

Answer 2

He tenido muy Tengo poca experiencia en incrustar controles en ventanas emergentes y tampoco soy un desarrollador web completo, pero puedo decir al mirar su código de muestra que está estructurado incorrectamente. En primer lugar, mira esto blog hay un fragmento de código en él.

Tienes tu código estructurado como tal:

<audio controls="">
   <source src="https://downloads.esri.com/agol/labs/maptour/horse.mp3" type="audio/mpeg"> 
   </source>
</audio>

No necesitas el </source> , lo ves correctamente estructurado en la respuesta de @Bjorn_Svenssons.

Tu intento de poner un if then else como lógica es defectuoso, escribiste:

{Species} was heard here
<br/>
<br/>
IIf($feature.Species=="Egret". "<audio controls=""> <source src="https://downloads.esri.com/agol/labs/maptour/horse.mp3" type="audio/mpeg">
</source>
</audio>", "<audio controls="">
<source src="https://www.xeno-canto.org/sounds/uploaded/XTVEPHMPPJ/Haematopus_leucopodus_1984_02_04e.mp3" type="audio/mpeg">
</source>
</audio>

En tu comando IIf() tienes un punto en lugar de una coma después de "Egret" y tampoco tienes un corchete de cierre. Así que tu código nunca se ejecutaría de todos modos. Pero creo que el mayor problema aquí es que estás intentando incrustar los comandos arcade directamente en el HTML, lo cual "no va a funcionar".

Echa un vistazo a esto blog sobre cómo integrar la lógica de la arcada en el HTML. No es algo que haya tenido que hacer todavía.