nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Icon in list displays is the wrong color

AndrewSmeltz

Hello,

I am configuring a Dashboard with a list. I would like the list to display a symbol icon. Under list options, when the when icon is enabled, the symbol displayed does not have the correct color. The color of the symbol icon does not match the color of the symbol in the web map that underlies the dashboard. I have discovered that you can change other parameters using advanced formatting but not the icon color (I think?). Does anyone have insights as to why the color of the symbol icon does not match the symbol on my map? Does anyone know how to format to color of the symbol icon in the list to make it match the map.

Thanks in advance!

This is how my symbol icon displays in the list on my dashboard:

This is what the symbol looks like on my map:

Encuentra más publicaciones etiquetadas con

ArcGIS Online

Accepted answers

AndrewSmeltz

I solved the issue! In the underlying web map, the symbology of polygon layer must be BASIC POLYGON not a vector polygon. This will correct the icon symbol in the list widget! Shout out to ESRI Support Services for this one.

All comments

JA7

The built-in icon symbology is based on the layer source. If you are pulling the layer in from the map it will display the map symbology, if it is pulled in as a stand alone layer, it will display the default symbology of the layer.

Notice how both layers still use the polygon shape as the icon. Your image displays a square icon and you state your are using the default icon setting. To me, that indicates that your list data layer is a point layer that uses square symbology. I would check that you are using the correct layer in your list.

If you are not using the default icon setting, and are using HTML to display a custom icon, then you need to use Arcade to explicitly set the values. You cannot pull from your map symbology.

// Dynamic Icon

var clr = When($datapoint.SQMI > 264626, '#2171b5',
                $datapoint.SQMI > 104094, '#6baed6',
                $datapoint.SQMI > 36187, '#bdd7e7', '#eff3ff')

var svg = Concatenate('<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="' + clr + '" viewBox="0 0 256 256"><path d="M224,48V208a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32H208A16,16,0,0,1,224,48Z"></path></svg>')

return {
  textColor: '',
  backgroundColor: '',
  separatorColor:'',
  selectionColor: '',
  selectionTextColor: '',
  attributes: {
    svg: svg
  }
}

AndrewSmeltz

Hi Jen,

Thank you for your reply. Everything you said makes sense. However, the layer that I am using is a polygon layer. I actually have 4 lists in my dashboard. Each list is reporting the value of a polygon layer. 3 of the lists have the problem I’ve described. One is displaying the correct symbology. I can’t figure out why. I just tried removing the transparency from the map layer, that did not correct the problem.

The symbology displayed in the icon does not match the default symbology for these layers. It should match the symbology of the map because the list is configured as a map layer. It does not match the symbology of the map layer either.

Do you have any other ideas why it’s behaving this way? Do you think I need an ESRI Support ticket?

Thanks again for your input.

Andrew

JA7

I would recommend opening a support ticket then, as this is very unusual and not something I have heard of happening.

AndrewSmeltz

Will do, thanks for your time!

AndrewSmeltz

Únete a la Conversación

Los miembros registrados pueden publicar, seguir actualizaciones y más. ¿Nuevo aquí? Regístrate gratis.

Enlaces Rápidos

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.