Handle semi-transparency in canvas icon-src/icon-color and fill-pattern-src/fill-color combinations

[mike-000]

Fixes #15290
Fixes #15318 (comment)

Makes the handling of alpha in icon-color and icons in IconImage consistent with WebGL

[github-actions]

📦 Preview the website for this branch here: https://deploy-preview-15295--ol-site.netlify.app/.

[tschaub]

The icon already accepts an opacity. It seems like it would be simpler to parse the color and remove any alpha before rendering it. Then the alpha could be applied as opacity. And we need to decide how to handle cases when both opacity and alpha are supplied.

[mike-000]

Opacity is an updateable setting for all ol/style/Image subclasses (which might also have alpha in their fill or stroke) and is handled by the canvas layer renderer, while color is applied when the IconImage is constructed. Also an icon can have semi transparent regions (as in the test), which were also not handled consistently compared to WebGL.

Applying an opacity in addition to a color with alpha appears to give consistent results for canvas and WebGL in the test setup, i.e. 'icon-color': [255, 0, 0, 0.25], is equivalent to 'icon-color': [255, 0, 0, 0.5], 'icon-opacity': 0.5, and 'icon-color': [255, 0, 0, 1], 'icon-opacity': 0.25, in both renderers.

Due to the need to handle semi-transparency in the original image, all of this change apart from the single line ctx.globalAlpha = color[3]; would still be needed even if color alpha was combined with opacity, so handling that elsewhere when it is currently unique to IconImage would not be a simplification, especially for fill patterns which do not use opacity.

[mike-000]

I have checked how well outputs from canvas and WebGL match in a setup similar to the rendering test, and with various combinations of icon-color alpha, icon-opacity and layer opacity, using ol/source/Raster to highlight any pixels which are not exactly the same

It is apparent that using 0.5 twice in those situations can produce more differences than using 0.25 once - this is because there is no such thing as a 0.5 alpha, it is either 127/255 or 128/255 - and using those together will produce a better match. However specifying 127/255 as alpha for an icon-color does not work as expected as ol/color#asString rounds alpha to 2 places, which then produces the same result as 128/255.

[mike-000]

The IE fallback removed in #13912 always worked correctly, and was probably faster even without the additional drawImage calls needed to make the multiply globalCompositeOperation work as expected, so is used again as long as the canvas is not tainted.

[github-actions]

📦 Preview the website for this branch here: https://deploy-preview-15295--ol-site.netlify.app/.

[mike-000]

@tschaub @ahocevar Ready for review