visgl / deck.gl

WebGL2 powered visualization framework
https://deck.gl
MIT License
12.29k stars 2.09k forks source link

HeatmapLayer doesn't work on Samsung Galaxy S20, S10 and A10 #5463

Open nekitk opened 3 years ago

nekitk commented 3 years ago

Description

On some Samsung devices (tested S20, S10 and A10) HeatmapLayer isn't visible.

Screenshot from browserstack: image

Screenshot from a real A10: image

We've tested both at browserstack and on real devices with same results

Expected Behavior

HeatmapLayer is visible. Tried on iPhone, Xiaomi Redmi Note and Google Pixel devices — it works there.

Repro Steps

Open https://deck.gl/examples/heatmap-layer/ on a Samsung Galaxy S20 or S10

Environment

Logs

Console logs from S20:

[.WebGL-0xe8cd9200]GL ERROR :GL_INVALID_OPERATION : GetShaderiv: <- error from previous GL command
[.WebGL-0xe8cd9200]GL ERROR :GL_INVALID_OPERATION : glFramebufferTexture2DMultisample: <- error from previous GL command

chrome://gpu output: image image

Full output ``` Graphics Feature Status Canvas: Hardware accelerated Compositing: Hardware accelerated Multiple Raster Threads: Disabled Out-of-process Rasterization: Hardware accelerated OpenGL: Enabled Hardware Protected Video Decode: Unavailable Rasterization: Hardware accelerated Skia Renderer: Disabled Surface Control: Enabled Video Decode: Hardware accelerated Vulkan: Disabled WebGL: Hardware accelerated WebGL2: Hardware accelerated Driver Bug Workarounds clear_uniforms_before_first_program_use disable_program_caching_for_transform_feedback dont_delete_source_texture_for_egl_image max_msaa_sample_count_4 max_texture_size_limit_4096 remove_dynamic_indexing_of_swizzled_vector scalarize_vec_and_mat_constructor_args use_virtualized_gl_contexts disabled_extension_GL_KHR_blend_equation_advanced disabled_extension_GL_KHR_blend_equation_advanced_coherent disabled_webgl_extension_EXT_disjoint_timer_query disabled_webgl_extension_EXT_disjoint_timer_query_webgl2 Problems Detected Protected video decoding with swap chain is for certain Intel and AMD GPUs on Windows: 1093625 Disabled Features: protected_video_decode Clear uniforms before first program use on all platforms: 124764, 349137 Applied Workarounds: clear_uniforms_before_first_program_use Always rewrite vec/mat constructors to be consistent: 398694 Applied Workarounds: scalarize_vec_and_mat_constructor_args Limit max texure size to 4096 on all of Android Applied Workarounds: max_texture_size_limit_4096 Disable KHR_blend_equation_advanced until cc shaders are updated: 661715 Applied Workarounds: disable(GL_KHR_blend_equation_advanced), disable(GL_KHR_blend_equation_advanced_coherent) The Mali-Gxx driver does not guarantee flush ordering: 678508 Applied Workarounds: use_virtualized_gl_contexts Don't expose disjoint_timer_query extensions to WebGL unless site isolation is enabled: 808744 Limit MSAA to 4x on Android devices: 797243 Applied Workarounds: max_msaa_sample_count_4 Program binaries don't contain transform feedback varyings on Mali GPUs: 961950 Applied Workarounds: disable_program_caching_for_transform_feedback Remove dynamic indexing for swizzled vectors on Android: 709351 Applied Workarounds: remove_dynamic_indexing_of_swizzled_vector Some drivers seem to require as to use original texture whenever possible: 1052114, 1117370 Applied Workarounds: dont_delete_source_texture_for_egl_image Raster is using a single thread. Disabled Features: multiple_raster_threads Version Information Data exported 2021-02-11T16:20:31.384Z Chrome version Chrome/86.0.4240.198 Operating system Android 10 Software rendering list URL https://chromium.googlesource.com/chromium/src/+/d8a506935fc2273cfbac5e5b629d74917d9119c7/gpu/config/software_rendering_list.json Driver bug list URL https://chromium.googlesource.com/chromium/src/+/d8a506935fc2273cfbac5e5b629d74917d9119c7/gpu/config/gpu_driver_bug_list.json ANGLE commit id fee4fc126724 2D graphics backend Skia/86 b939c288f3d6479d88d1444fafbe7441d11348aa Command Line chrome --disable-fre --proxy-server=http://85.209.178.88:26082 --proxy-bypass-list=<-loopback> --use-mobile-user-agent --top-controls-show-threshold=0.5 --top-controls-hide-threshold=0.5 --use-mobile-user-agent --enable-viewport --validate-input-event-stream --enable-longpress-drag-selection --touch-selection-strategy=direction --main-frame-resizes-are-orientation-changes --disable-composited-antialiasing --enable-dom-distiller --flag-switches-begin --flag-switches-end Driver Information Initialization time 77 In-process GPU false Passthrough Command Decoder false Sandboxed false GPU0 VENDOR= 0x0000 [ARM], DEVICE=0x0000 [Mali-G77] *ACTIVE* Optimus false AMD switchable false Driver vendor ARM Driver version 20.0.01rel0 GPU CUDA compute capability major version 0 Pixel shader version 3.20 Vertex shader version 3.20 Max. MSAA samples 16 Machine model name SM-G981B Machine model version GL_VENDOR ARM GL_RENDERER Mali-G77 GL_VERSION OpenGL ES 3.2 v1.r20p0-01rel0.###other-sha0123456789ABCDEF0### GL_EXTENSIONS GL_EXT_debug_marker GL_ARM_rgba8 GL_ARM_mali_shader_binary GL_OES_depth24 GL_OES_depth_texture GL_OES_depth_texture_cube_map GL_OES_packed_depth_stencil GL_OES_rgb8_rgba8 GL_EXT_read_format_bgra GL_OES_compressed_paletted_texture GL_OES_compressed_ETC1_RGB8_texture GL_OES_standard_derivatives GL_OES_EGL_image GL_OES_EGL_image_external GL_OES_EGL_image_external_essl3 GL_OES_EGL_sync GL_OES_texture_npot GL_OES_vertex_half_float GL_OES_required_internalformat GL_OES_vertex_array_object GL_OES_mapbuffer GL_EXT_texture_format_BGRA8888 GL_EXT_texture_rg GL_EXT_texture_type_2_10_10_10_REV GL_OES_fbo_render_mipmap GL_OES_element_index_uint GL_EXT_shadow_samplers GL_OES_texture_compression_astc GL_KHR_texture_compression_astc_ldr GL_KHR_texture_compression_astc_hdr GL_KHR_texture_compression_astc_sliced_3d GL_EXT_texture_compression_astc_decode_mode GL_EXT_texture_compression_astc_decode_mode_rgb9e5 GL_KHR_debug GL_EXT_occlusion_query_boolean GL_EXT_disjoint_timer_query GL_EXT_blend_minmax GL_EXT_discard_framebuffer GL_OES_get_program_binary GL_OES_texture_3D GL_EXT_texture_storage GL_EXT_multisampled_render_to_texture GL_EXT_multisampled_render_to_texture2 GL_OES_surfaceless_context GL_OES_texture_stencil8 GL_EXT_shader_pixel_local_storage GL_ARM_shader_framebuffer_fetch GL_ARM_shader_framebuffer_fetch_depth_stencil GL_ARM_mali_program_binary GL_EXT_sRGB GL_EXT_sRGB_write_control GL_EXT_texture_sRGB_decode GL_EXT_texture_sRGB_R8 GL_EXT_texture_sRGB_RG8 GL_KHR_blend_equation_advanced GL_KHR_blend_equation_advanced_coherent GL_OES_texture_storage_multisample_2d_array GL_OES_shader_image_atomic GL_EXT_robustness GL_EXT_draw_buffers_indexed GL_OES_draw_buffers_indexed GL_EXT_texture_border_clamp GL_OES_texture_border_clamp GL_EXT_texture_cube_map_array GL_OES_texture_cube_map_array GL_OES_sample_variables GL_OES_sample_shading GL_OES_shader_multisample_interpolation GL_EXT_shader_io_blocks GL_OES_shader_io_blocks GL_EXT_tessellation_shader GL_OES_tessellation_shader GL_EXT_primitive_bounding_box GL_OES_primitive_bounding_box GL_EXT_geometry_shader GL_OES_geometry_shader GL_ANDROID_extension_pack_es31a GL_EXT_gpu_shader5 GL_OES_gpu_shader5 GL_EXT_texture_buffer GL_OES_texture_buffer GL_EXT_copy_image GL_OES_copy_image GL_EXT_shader_non_constant_global_initializers GL_EXT_color_buffer_half_float GL_EXT_color_buffer_float GL_EXT_YUV_target GL_OVR_multiview GL_OVR_multiview2 GL_OVR_multiview_multisampled_render_to_texture GL_KHR_robustness GL_KHR_robust_buffer_access_behavior GL_EXT_draw_elements_base_vertex GL_OES_draw_elements_base_vertex GL_EXT_protected_textures GL_EXT_buffer_storage GL_EXT_external_buffer GL_EXT_EGL_image_array GL_EXT_texture_filter_anisotropic GL_OES_texture_float_linear Disabled Extensions GL_KHR_blend_equation_advanced GL_KHR_blend_equation_advanced_coherent Disabled WebGL Extensions EXT_disjoint_timer_query EXT_disjoint_timer_query_webgl2 Window system binding vendor Window system binding version Window system binding extensions Direct rendering version unknown Reset notification strategy 0x8252 GPU process crash count 0 gfx::BufferFormats supported for allocation and texturing R_8: not supported, R_16: not supported, RG_88: not supported, BGR_565: not supported, RGBA_4444: not supported, RGBX_8888: not supported, RGBA_8888: not supported, BGRX_8888: not supported, BGRA_1010102: not supported, RGBA_1010102: not supported, BGRA_8888: not supported, RGBA_F16: not supported, YVU_420: not supported, YUV_420_BIPLANAR: not supported, P010: not supported Compositor Information Tile Update Mode One-copy Partial Raster Enabled GpuMemoryBuffers Status R_8 Software only R_16 Software only RG_88 Software only BGR_565 GPU_READ, SCANOUT RGBA_4444 Software only RGBX_8888 GPU_READ, SCANOUT RGBA_8888 GPU_READ, SCANOUT BGRX_8888 Software only BGRA_1010102 Software only RGBA_1010102 Software only BGRA_8888 Software only RGBA_F16 Software only YVU_420 Software only YUV_420_BIPLANAR Software only P010 Software only Display(s) Information Info Display[0] bounds=[0,0 360x800], workarea=[0,0 360x800], scale=3, rotation=0, panel_rotation=0 external. Color space (all) {primaries:BT709, transfer:IEC61966_2_1, matrix:RGB, range:FULL} Buffer format (all) RGBA_8888 SDR white level in nits 100 Bits per color component 8 Bits per pixel 24 Video Acceleration Information Encode vp8 0x0 to 1280x720 pixels, and/or 30.000 fps Encode h264 baseline 0x0 to 1280x720 pixels, and/or 30.000 fps Vulkan Information Device Performance Information Log Messages [ERROR:gles2_cmd_decoder_autogen.h(1899)] : [.WebGL-0xb0c61800]GL ERROR :GL_INVALID_OPERATION : GetShaderiv: <- error from previous GL command [ERROR:gles2_cmd_decoder.cc(8620)] : [.WebGL-0xb0c61800]GL ERROR :GL_INVALID_OPERATION : glFramebufferTexture2DMultisample: <- error from previous GL command [ERROR:gles2_cmd_decoder_autogen.h(1899)] : [.WebGL-0xe8cd9c00]GL ERROR :GL_INVALID_OPERATION : GetShaderiv: <- error from previous GL command [ERROR:gles2_cmd_decoder.cc(8620)] : [.WebGL-0xe8cd9c00]GL ERROR :GL_INVALID_OPERATION : glFramebufferTexture2DMultisample: <- error from previous GL command [ERROR:gles2_cmd_decoder_autogen.h(1899)] : [.WebGL-0xe8cd9200]GL ERROR :GL_INVALID_OPERATION : GetShaderiv: <- error from previous GL command [ERROR:gles2_cmd_decoder.cc(8620)] : [.WebGL-0xe8cd9200]GL ERROR :GL_INVALID_OPERATION : glFramebufferTexture2DMultisample: <- error from previous GL command ```
Pessimistress commented 3 years ago

The errors seem to imply that there are other preceding errors? Are these all that you can see in the console?

Are these devices able to load the example on https://deck.gl/docs/api-reference/aggregation-layers/gpu-grid-layer ?

nekitk commented 3 years ago

The errors seem to imply that there are other preceding errors? Are these all that you can see in the console?

Yes, that's all the warnings I can see. Here's a full console output on heatmap example page:

/app-cffc30cdcc9be9a547ab.js:2 gatsby-theme-ocular: Loading ocular website generator (gatsby version)

/app-cffc30cdcc9be9a547ab.js:2 gatsby-theme-ocular loaded

/7f76a980-6b83e4d6ee08117543e6.js:1 This page appears to be missing CSS declarations for Mapbox GL JS, which may cause the map to display incorrectly. Please ensure your page includes mapbox-gl.css, as described in https://www.mapbox.com/mapbox-gl-js/api/.

(index):1 [.WebGL-0xb5f63f00]GL ERROR :GL_INVALID_OPERATION : GetShaderiv: <- error from previous GL command

(index):1 [.WebGL-0xb5f63f00]GL ERROR :GL_INVALID_OPERATION : glFramebufferTexture2DMultisample: <- error from previous GL command

Are these devices able to load the example on https://deck.gl/docs/api-reference/aggregation-layers/gpu-grid-layer ?

No, this example is empty too, but console warning is different:

[.WebGL-0xd9bd1400]GL ERROR :GL_INVALID_OPERATION : glReadPixels: <- error from previous GL command

image

Pessimistress commented 3 years ago

Thank you for helping with the testing. Could you go to https://www.khronos.org/registry/webgl/sdk/tests/webgl-conformance-tests.html?version=2.0.1 on one of these devices and report the failed tests?

nekitk commented 3 years ago

Working on it, but tests take too much time and sometimes devices even crash running them so it takes some time. But we'll get there. Is there any particular section of the tests which is most important?

nekitk commented 3 years ago

Here're test results from Samsung Galaxy A8 (issue reproduces on it too): webgl-conformance-2.0.1.txt

Pessimistress commented 3 years ago

Thank you! Could you share the result from the following pages:

nekitk commented 3 years ago

Here're results from Galaxy A8:

Also Galaxy S20 in browserstack produced same errors

Pessimistress commented 3 years ago

I do not have access to BrowserStack at the moment. Would you mind getting onto the deck.gl Slack so we can debug offline?

Pessimistress commented 3 years ago

Update: looks like the Samsung devices report that they support the EXT_float_blend extension but they throw when trying to actually render to a float target. This should definitely be reported as a bug to Chromium/Samsung. Meanwhile, we have two options to work around this:

nekitk commented 3 years ago

First option would be more desirable as it is hard to determine otherwise which devices need fallback or not (some Samsungs work alright). Also I suppose it may be fixed in the future with firmware updates.

nekitk commented 3 years ago

@Pessimistress second option is also ok, if it is faster and easier to implement

we could force this mode for all mobile devices while it is not fixed on Samsung/Chromium side

abouroubi commented 3 years ago

Hi, did anyone find a solution for this ? We're having the same issue but for showing a GeoJSON layer.

Pessimistress commented 3 years ago

@abouroubi Please do not report new issues under other peoples thread. Unlike the HeatmapLayer, GeoJsonLayer does not require any special WebGL features. You can use Discussions to get help.

hadarbak commented 1 year ago

@Pessimistress second option is also ok, if it is faster and easier to implement

we could force this mode for all mobile devices while it is not fixed on Samsung/Chromium side

how can i force the layer to fallback to 'low precision'? HeatmapLayer doesn't have prop for 'highPrecision' to set to false