Check if WebGL2 is supported and enabled in client's browser
Asked Answered
T

2

8

I want to check if WebGL 2 is enabled and supported in the user's browser.

There are a lot of posts for WebGL 1 but I found nothing related WebGL version 2.

Thomasson answered 28/1, 2019 at 12:1 Comment(0)
L
18

The way you're supposed to check is just to see if trying to get a webgl2 context succeeds or fails

const gl = document.createElement('canvas').getContext('webgl2');
if (!gl) {
  console.log('your browser/OS/drivers do not support WebGL2');
} else {
  console.log('webgl2 works!');
}
  

You can also check if window.WebGL2RenderingContext exists to try to guess if it's the browser that doesn't support WebGL2 or the user's OS/GPU/Drivers.

const gl = document.createElement('canvas').getContext('webgl2');
if (!gl) {
  if (typeof WebGL2RenderingContext !== 'undefined') {
    console.log('your browser appears to support WebGL2 but it might be disabled. Try updating your OS and/or video card drivers');
  } else {
    console.log('your browser has no WebGL2 support at all'); 
  }
} else {
  console.log('webgl2 works!');
}
Lancashire answered 28/1, 2019 at 14:54 Comment(4)
note: @Nik Kyriakides had an answer that appeared to be correct but he had a tiny typo. I can't undelete his answer though so I posted this one.Lancashire
I undeleted it. Thanks for the edit :) +1 nonetheless since this is a more comprehensive answer.Iden
the second one is not working on Angular 5, any idea, I am getting Cannot read property 'WebGL2RenderingContext' of undefined.Thomasson
Sorry, old habits die hard. Changed itLancashire
I
4

Check if webgl2 context is available on a canvas element like so:

const isWebGL2Supported = () => !!document.createElement('canvas').getContext('webgl2')

isWebGL2Supported() ? console.log('supported') : console.log('unsupported')
Iden answered 28/1, 2019 at 12:6 Comment(4)
producing the wrong output, my browser didn't support WebGL 2 and your code saying it supports it. I think it is checking WebGL version 1, not 2.Thomasson
@Thomasson which browser are you on?Iden
Google Chrome, version 2, It support WebGl but this feature is not enabled, I also don't have the hardware to accelerate WebGL, sorry for the confusion but I want to check if WebGL is running.Thomasson
This browser supports WebGL 2, but it is disabled or unavailable. Sometimes this is the result of older video drivers being rejected by the browser. Try updating your video drivers if possible. Also check out Get WebGL, or try installing the latest version of Chrome, or Firefox. This is what I am getting.Thomasson

© 2022 - 2024 — McMap. All rights reserved.