Allow extending AGOL/Portal Symbology with custom icon fonts

[JohnDye2]

ArcGIS Online and Portal's built-in symbols are pretty basic and its not a reasonable for an organization to expect Esri to be able to meet their unique symbology needs down to the letter. But Esri could empower organizations to do this by supporting the use of custom icon fonts in Portal's symbology selector.

Icon fonts are easy to put together using the help of a solution like Icon Font & SVG Icon Sets ❍ IcoMoon that allows you to import SVGs, load them into an Icon Font, including any custom colors if you like, then push those out to TTF, WOFF, WOFF2 and SVG Fonts.

It would be a great improvement to be able to take these fonts and either install them on the Portal machine or host them elsewhere and configure then Portal to make these fonts available in Portal's built in symbology selector as custom symbology collections for use in Webmaps.

If your custom symbology is comprised of PNGs, this is actually already possible. But, come on...PNGs? Icon fonts are:

Flexible - The web is optimized for displaying text. With icon fonts, changing the color of your icons or applying other CSS effects is pretty simple, meaning Esri could do some pretty awesome stuff with icon fonts like changing colors, stacking different glyphs and even CSS animations that would work anywhere. Animations would be particularly cool because the only way to do that currently is with animated GIFs and that does not work everywhere at all.

Scalable - Using icon fonts, changing the size of an icon is as simple as changing the font-size. All of the symbols could scale together in the font. If you need to change the size of specific symbols, CSS can handle that as well.

Vector - Icon fonts are 100% vector. So they scale perfectly and appear crisp on any device at any resolution.

Fast - They're fast! If you've ever looked at the network requests it takes to load a web map with a few layers symbolized by unique values, then you'll notice there's a ridiculous amount of requests to retrieve each unique symbol. That's dumb. Esri knows better than that. By having icons hosted in an icon font, you can load all of the icons you need in a single request. Even if you're using icons from multiple icon fonts, it's maybe 2 or 3 requests - one for each icon font needed. That's much better than say 40 requests to load each individual symbol! And icon fonts are meant for the web. They're small. We're talking kilobytes - so they load very fast which is great for mobile devices with constrained bandwidth. PNGs by contrast much larger on a per-symbol basis and if you're going with animated GIFs - man those can get out of hand really quickly.

Accessible - When done right, icon fonts are completely accessible and compatible with screen readers. For those with disabilities that use font-switching browser extensions, all you need to do is add !important to the icon font-family and it won't switch. So text-based fonts that should be switched won't be declared as !important and those font-switchers will swap them out as the user expects. But icon fonts used in the map are declared as !important and thus won't be switched out.

[JohnDye2]

So, in researching the feasibility of this idea, I stumbled onto a couple of Geonet posts where others had wanted to do this as well. The most helpful being https://community.esri.com/people/sgriebgeo/blog/2015/05/06/dynamic-custom-labeling-with-arcgis-for-... by Steven Grieb‌. There are a couple others that are very informative as well, including https://community.esri.com/people/odoe/blog/2015/01/07/label-markers-for-you-arcgis-javascript-apps  by Rene Rubalcava’s and GeoDecisions-Geo Tutorial: Using Custom Icon Fonts for Map Symbology by GeoDecisions.

So in essence, this is completely possible already if you’re building a custom app using the JavaScript API. So before someone points that out (sincerely, thanks if you were about too), my request is asking that Esri create a workflow for Organization Administrators to either upload and host icon fonts in AGOL and Portal (let’s call them ‘symbol collections’) to make them available in Portal/AGOL’s Default Map Viewer app symbol selector and Web App Builder. Alternatively, if Esri is concerned about malicious code embedded in fonts, I think a requiring the Administrator to self-host would also be fine. In fact, it might be better as solutions like Icon Font & SVG Icon Sets ❍ IcoMoon have a built in build pipeline that allows users to build the font files, push them to S3 along with their style sheets and manage them directly within that app.

[MohandKETTOUCHE]

this is "How to" procedure for making costum symbology in Portal for ArcGIS

How To: Configure Portal for ArcGIS with custom symbology

[AnthonyRyanEQL]

Is there anything more up to date for 10.6.1 or have i missed something?

Thanks

[MohandKETTOUCHE]

its just link for old procedure for who is interested.

 thank you for your idea.

Le 23/07/2018 à 13:10, Anthony Ryan a écrit :

>

GeoNet <https://community.esri.com/?et=watches.email.idea_comment>

>

Allow extending AGOL/Portal Symbology with custom icon fonts

new comment by Anthony Ryan

<https://community.esri.com/people/anthony.ryan_ergon> View all

comments on this idea

<https://community.esri.com/ideas/14921-allow-extending-agolportal-symbology-with-custom-icon-fonts?commentID=63551#comment-63551>

>

[ThomasEdghill]

Thank you for posting this Idea, John, and for the additional context in this comment. I've marked this idea as "Reviewed" for now.

[JohnDye2]

Its worth noting, this procedure is only valid for raster-based symbols like jpg or png. Icon fonts are vector based.

[KarstenRank]

Does someone know, what size the png must have in portal and what size should be chosen in the json used for updating the symbol sets?

It would be fine to get vector based symbols!

[JohnDye2]

They can be any size that works for your workflows. One of the things to note about raster-based symbology is that its not going to scale very well, so choose a size that will work for most of your workflows. I wouldn't do anything smaller than 32px as that is a little big for a desktop interface, but borderline too small for a touch interface. If your workflows don't need to be supported in mobile apps like Collector, consider going smaller.

[MaggieBusek]

Hi John,

Thank you for this idea! There have been many improvements to customizing your symbology in Map Viewer. Please see this blog covering some of your options. If your needs are still not met with the current functionality, could you please open a new Idea with details on suggestions for additional improvement? Thank you!

Best,
Maggie