Setting { fill | line }-pattern to "" invalidates other { fill | line }-* properties

[chloekraw]

Ticket to track the same issue in GL-JS that appears on GL-Native as documented in mapbox/mapbox-gl-native#14331.

Steps to reproduce

1. Set line-pattern to "" (empty string) on a layer.

Expected behavior

Users who want to use a patterned and non-patterned line in the same layer can do so by setting line-pattern to "" or undefined.

Users have reported trying to use this as a workaround for lack of DDS support in line-dasharray (#3045). Similar behavior occurs if you try to render a patterned fill and non-patterned fill in the same layer.

Actual behavior

Other paint properties such as line-color and line-dasharray are overwritten, so no line is drawn.

Configuration

Browser: All
Operating systems + versions: All

[asheemmamoowala]

Users who want to use a patterned and non-patterned line in the same layer

@chloekraw can you elaborate on why it is important for these properties to be usable on the same layer?

The workaround to this issue is to use a filter to separate the source data and specify two layers - one for line-pattern and another for line-color.

[chloekraw]

@asheemmamoowala does an implementation with that workaround work when you are building an interactive map that allows users to filter the data dynamically on one or more dimensions?

Your goal would be to visually distinguish some data based on a user's filters with patterns and other data with opaque colors, so the filtering happens at runtime. In this case, is it possible to dynamically re-allocate source data into different layers at runtime?

[asheemmamoowala]

In this case, is it possible to dynamically re-allocate source data into different layers at runtime?

Yes, this would work by updating the filter on each of the two layers appropriately, and update any other style expressions on the layer's paint properties as needed.

[mijamo]

The thing is layers are used for more than drawing: they have an impact on interactivity, queries etc., so adding more layers also adds complexity to the application itself which is not ideal.

I am not sure of the performance impact either but I suppose having very frequent changes in the filter is not very efficient compared to a simple changed in a paint property of a single layer? My use case is to trigger a pattern on hover on a polygon in a layer with several dozen thousands polygons.

[misaugstad]

I have a very similar use case! Dynamically selecting lines, and wanting to show a pattern for selected lines only. Using filtering makes the code more complex than I think it should be!