Lightsaber Lines –I mean Firefly Lines

Hang on! This blog post can alternatively be read in a mind-bending full-screen epically scroll-tastic Cascade Story Map.

Ah the glow of a cool-blue firefly map. There is a sort of balance between the softness of the geographic features and the sharpness of the overall impression.

There are loads of reasons why you might consider firefly for your map, including the visual representation of uncertainty, the intrinsic value of aesthetic appeal, and of course the First Law of Geography

Everything is related to everything else, but near things are more related than distant things.

This locally-blurred diminishing-impact a feature has on its environment can sometimes be represented by cartographers as a glow. Like these hurricanes…

Or these earthquakes…

They use pre-generated glowing dot images as point symbols, available here and here. But what about lines? How can we cobble together a passable glowing line effect, like in this saber-licious map of tornadoes…

Or this irradiated map of hexbins?

It’s a hack! And a super simple one. You just make a handful of copies of your line or polygon feature and make them nearly transparent (say, around 85%), assign the layers’ stroke color that of your mapped theme, and give each layer a slightly thicker stroke. The topmost layer should be the thinnest stroke and have a faint white color (and, if it’s a polygon layer, a semi-transparent thematic fill).

Sounds more complicated than it is. Let’s walk through this using the most visceral example I can think of.

It all starts with a thin, white, semi-transparent stroke.

Behind this, we paste a nearly transparent copy and give it a slightly thicker stroke in the color of our choice.

And do it again.

And again. As you see fit.

You’ve got glowing lines, my friend!

Let’s take a more literal look at how to construct these in ArcGIS Pro. In the following example I have a nice smoking hot firefly basemap all ready to go…

Ah ArcGIS Pro with a firefly style basemap. So comforting. So accommodating.
See the set of layers on the left? Let’s walk through each of those…

Here is a layer of country boundaries.
Stroke thickness 0.7pt
Layer transparency 40%
#FFFFFF

A copy of the layer, positioned beneath it in the Contents panel, is slightly thicker, and nearly transparent. It’s pretty subtle but that’s the point –this hack is an additive process.
Stroke thickness 3pt
Layer transparency 85%
#00FFC5

A second copy of the stroke adds some more dimension.
Stroke thickness 5pt
Layer transparency 85%
#00C5FF

Here, with only three colorized copies of the lines and already we have a passable glow effect. Of course it’s up to you to add more, for a smoother, or thicker, effect but there is a trade-off in performance if you are building a web map.
Stroke thickness 7pt
Layer transparency 85%
#005CE6

Alternatively, instead of making multiple copies of the layer, you can achieve the same effect by using multiple renderings of a single layer using Symbol Layer Drawing (in the real world Symbol Layer Drawing lets you put casing around roads and stuff).

When it comes to thematic maps (like the tornado and hexbin maps at the top), you’ll want the glow colors to be tied to a data range. In this case you’ll have to define a manageable handful of classes, and break them out into separate groups of “glow” layers for each class. It’s a little bit of effort, but nothing of value comes without some amount of effort.
So there it is. A simple method (hack) for making lines and polygons glow all firefly-style. Now go forth and use your powers for good, or something.

Thanks for following along! I hope you give the glow-strokes hack a shot, and of course I hope you share what you’ve made! It is your destiny. Fun maps inspire others to make fun maps. Sometimes fun maps just happen to glow a little.
Happy mapping, John

This entry was posted in ArcGIS Pro, Cartographic Design, Geodata, Mapping and tagged , , , , . Bookmark the permalink.

Leave a Reply

5 Comments

  1. koelker12 says:

    All of these outside-the-box cartography ideas are really great. I appreciate the posts!

  2. kevin_brenninkmeijer says:

    This is awesome! Do you mind sharing the hex color codes for the red, purple and green maps?