How to give cluster symbol transparency in HTML5

I am trying to see if I can give the cluster symbol (big red circles by default) some transparency in the HTML5 viewer so that it doesn't totally obliterate the underlying data--especially when significantly zoomed out. (This transparency was possible with the Silverlight viewer, but doesn't seem possible with the HTML5 viewer...but hopefully I am wrong).

I noticed in the Site.xml that there is a Hex code for the the Feature Clustering Background Color. This Hex code definitely contains the alpha channel (allowing transparency setting), but doesn't seem to honor it if I change it (to something like #4DFF0000 or 30% transparency). The default setting of #FF... actually is 100% opaque, but if I try any other setting, the color still shows 100% opaque. (Below image shows the default setting in the Site.xml)

Am I doing something wrong, or does the HTML5 viewer not currently honor these settings for the Clustering Background?

BTW, I am testing in Chrome 62+ and Firefox 57.

Thanks!

Michael

Berend Veldkamp

13. Dezember 2017 10:12

You could add some custom css to [VIEWER]\VirtualDirectory\Resources\Styles\Custom\Desktop.css (And tablet and handheld). For example, to make all circles 50% transparent:

svg circle {
  opacity: 0.50;
}

Or to other markers transparent too:

svg {
  opacity: 0.5;
}

You may need to use a more specific selector (e.g. #map_gc)

Permanently deleted user

14. Dezember 2017 17:26

Thanks Berend!

That worked. I decided to use:

svg circle {
     fill-opacity: 0.5;
}

How to give cluster symbol transparency in HTML5

Kommentare

Sie haben nicht gefunden, wonach Sie suchten?