Allow `icon-image` to accept a value that means "no icon-image"

[nickidlugash]

Motivation

Right now, if you don't want to include an icon for a symbol layer, you simply don't assign an icon-image value. However, there are situations where you want to assign an expression value for icon-image that includes a "no icon image" assignment for just some zoom levels or some conditions.

Design Alternatives

• Use icon-opacity to control visibility of icons within a style layer (which is what we currently do in our core styles).
• Assign an empty string (""). However, this will be treated like any other string that doesn't exist in the spritesheet (i.e. will soon throw a warning, per https://github.com/mapbox/mapbox-gl-js/issues/6823).

Design

Per conversation with @jfirebaugh, perhaps it would make sense to special case null values to mean "no icon image" (the alternative perhaps being to special case empty strings). Currently, icon-image will not accept null values.

Mock-Up

Example expressions:

"icon-image": [
  "step",
  ["zoom"],
  "dot-11",
  8,
  null
]

"icon-image": [
  "case",
  ["has", "text_anchor"],
  "dot-11",
  null
]

Concepts

Where do the concepts set new precedents?

Using null values to represent "no icon" is different to how text-field works, which accepts (and defaults to) empty strings to mean "no text".

Implementation

Not sure what the critical implementation considerations are for this.

/cc @mapbox/gl-core @mapbox/maps-design @mapbox/studio

[ansis]

This sounds good to me. Should the empty string "" also be treated as "no image"? Should the empty string be a valid name (map.addImage("", image))?

[nickidlugash]

Should the empty string "" also be treated as "no image"? Should the empty string be a valid name (map.addImage("", image))?

Regarding how this currently works, @jfirebaugh mentioned in chat the other day:

Theoretically you could have an empty ID in the spritesheet as well, and it would use that image. But I haven't tried this.

@ansis @jfirebaugh can you clarify: if we do (continue to) allow an empty string to be a valid sprite ID, would the only way to generate this sprite value be via gl-js (map.addImage("", image)) or our SDKs? AFAIK, you cannot create an svg with an empty string as the filename to upload via Styles API.

I can't think of any use cases for keeping an empty string as a valid sprite ID, but I don't have experience using our API/SDKs to generate sprite images.

[nickidlugash]

@ansis @jfirebaugh Any further thoughts on whether we can/should implement this?

[palhal]

Yes, this would be very much appreciated. At first glance, an empty string seems to work, but it causes problems with @mapbox/mapbox-gl-draw. I spent almost an entire day trying to figure out why drawing was not working properly. There are possible other side affects as well.