Vizzuality / layer-manager

A library to get a layer depending on provider and layer spec
https://layer-manager-docs.vercel.app
MIT License
18 stars 12 forks source link

Inconsistencies between Chrome/Firefox and Safari in the Integrated Alerts Decoded Layer #153

Open luccasmmg opened 6 months ago

luccasmmg commented 6 months ago

It seems that Safari(Webkit) and other browsers have different values for the color.r inside the shaders for decoded layers.

The best way to see this in action is to go to the docs and check the layer there https://layer-manager-docs.vercel.app/?path=/story/playground-decoded-raster-layer--integrated-alerts

In chrome nothing appears, while in Safari you have a bunch of pink, at first i thought this was maybe a case of the decodedParams being wrong, but if i check the GFW code and copy the params for startDayIndex and endDayIndex to something a little more correct, in chrome everything appears fine, but Safari then barely shows anything

Chrome

image

Safari

image

I tried digging a little around the code to find what is the issue, and the most that i found is that this seems to be related to the value returned by color.r

You can see this by changing the decodeFunction to something way simpler like

  float r = color.r * 255.;
  alpha = r;

On Chrome you get something like this

It seems that Safari(Webkit) and other browsers have different values for the color.r inside the shaders for decoded layers.

The best way to see this in action is to go to the docs and check the layer there https://layer-manager-docs.vercel.app/?path=/story/playground-decoded-raster-layer--integrated-alerts

In chrome nothing appears, while in Safari you have a bunch of pink, at first i thought this was maybe a case of the decodedParams being wrong, but if i check the GFW code and copy the params for startDayIndex and endDayIndex to something a little more correct, in chrome everything appears fine, but Safari then barely shows anything

Chrome

image

Safari

image

I tried digging a little around the code to find what is the issue, and the most that i found is that this seems to be related to the value returned by color.r

You can see this by changing the decodeFunction to something way simpler like

  float r = color.r * 255.;
  alpha = r;

This is a comparission between Chrome/And a Webkit based browser(I dont have a Mac so im testing using Epiphany a linux browser, but on Safari the results should be the same, already tested the docs in Safari)

Screenshot from 2024-02-22 16-11-22

I made this minimum working example here https://webkit-bug-layers.pages.dev/ with the code in here https://github.com/luccasmmg/webkit-bug-layers in case thats helpful