Mapbox-gl-js: Stacking polygons with fill-color and opacity doesn't darken overlapping fills

[geografa]

When styling a polygon with overlaps, the fill-color and opacity remain the same:

Expected results are similar to studio (CartoCSS):

Live example:
http://jsfiddle.net/0npp5v9t/

[nickidlugash]

It looks like right now fill-opacity is a per-layer property. This corresponds to carto's opacity property.

@geografa it looks like you're expecting the behavior to be per-geometry, like carto's polygon-opacity property (and line-opacity, polygon-pattern-opacity, etc).

Which behavior does it make more sense for GL's fill-opacity to correspond to? Having both behaviors as separate properties (similar to carto) in GL would be really useful, IMO, but I guess that's a style spec issue.

[ansis]

To draw polygons, we current make a stencil of which pixels are within any polygon and which aren't. We then paint all pixels within the stencil once, so even if multiple polygons cover the same pixel the pixel will get coloured once.

When we switch to https://github.com/mapbox/mapbox-gl-js/pull/948 for drawing fills overlapping polygons will be drawn as expected. They should already be drawn this way in -native.

[nickidlugash]

@ansis is it possible to separate this out into a different property, per https://github.com/mapbox/mapbox-gl-style-spec/issues/273? Both ways of declaring opacity are very useful.

[mourner]

This was fixed by #1606.

[cyrilchapon]

In 2018, is there a way to accomplish the first behavior ? As the second is the default, and no polygon-opacity prop is documented is inside the style spec

EDIT: To clarify, I want a semi-transparent layer, composed of multiple, overlapping, Features, but keep a static global visual opacity for the layer