Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

A fill extrusion layer doesn't follow color opacity when using rgba for fill-extrusion-color paint property? #10078

Open
FergusDevelopmentLLC opened this issue Nov 5, 2020 · 1 comment
Labels
needs investigation 🔍 Issues that require further research (e.g. it's not clear whether it's GL JS or something else)

Comments

@FergusDevelopmentLLC
Copy link

mapbox-gl-js version:
v1.12.0

browser:
Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36
https://www.whatsmybrowser.org/b/QZK8A

Steps to Trigger Behavior

Example that shows behavior:

  1. Visit: https://jsbin.com/feyulic/edit?html,outputl
  2. When the "county-extruded" layer is not visible initially by setting fill-extrusion-opacity: 0, the map displays as expected. The three counties matched in the getColor() function are correctly filled red, green, and blue. The unmatched counties are colored with 'rgba(204, 204, 204, 0)'. Because the rgba alpha opacity is set to 0 on the unmatched counties, they correctly do not fill. The lightblue background color on #map-container shows through as expected.

correct.

  1. When the 'Show extruded layer' button is clicked and the county-extruded layer is shown by setting fill-extrusion-opacity to 1, the "other" counties don't seem to follow the 0 opacity for fill-extrusion-color. They appear colored in black.

correct.

This may be related. mapbox/mapbox-gl-style-spec#556

I am experimenting with dynamically styling a vector layer. Setting color of a fill type layer looked promising, but when I extended the idea to a fill-extrusion layer, I ran into this issue.

Expected Behavior

fill-extrusion-color should follow the alpha channel as fill-color does.

Actual Behavior

fill-extrusion-color fills black if the alpha channel is 0

@sgolbabaei sgolbabaei added the needs investigation 🔍 Issues that require further research (e.g. it's not clear whether it's GL JS or something else) label Nov 6, 2020
@FergusDevelopmentLLC
Copy link
Author

FergusDevelopmentLLC commented Nov 9, 2020

Further inspection lead me here...
https://github.com/mapbox/mapbox-gl-js/blob/main/src/style-spec/reference/v8.json

for fill-extrusion-color.doc it says...

If this color is specified as `rgba` with an alpha component, the alpha component will be ignored**; use `fill-extrusion-opacity` to set layer opacity.

This would explain why the extruded "other" layers are not following the alpha component. But, I would expect "other" counties in this layer to be colored light gray (204, 204. 204, ignored/1?) instead of black.

I see that if I explicitly set the alpha to 'rgba(204, 204, 204, 1)', the "other" extruded counties are shown as solid light gray, seeming to follow the alpha value.

fill-extrusion-opacity cannot be driven by data, I believe.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
needs investigation 🔍 Issues that require further research (e.g. it's not clear whether it's GL JS or something else)
Projects
None yet
Development

No branches or pull requests

2 participants