Three.js, webgl desteğini algılar ve normal tuvalete geri dönüş yapar

Question

Üç.js kullanan herkes webgl desteğini algılamanın mümkün olup olmadığını ve sunulamıyorsa standart bir Tuval için geri dönüş yapılıp yapılamayacağını söyleyebilir mi?

Answer 1

Evet, mümkün. WebGLRenderer yerine CanvasRenderer'u kullanabilirsiniz.

1) bu WebGL wiki makalesini okuyun: WebGL tespiti Hakkında

https://github.com/mrdoob/three.js/blob/master/examples/js/Detector.js

renderer = Detector.webgl? new THREE.WebGLRenderer(): new THREE.CanvasRenderer(); 

: http://www.khronos.org/webgl/wiki/FAQ

if (!window.WebGLRenderingContext) { 
    // the browser doesn't even know what WebGL is 
    window.location = "http://get.webgl.org"; 
    } else { 
    var canvas = document.getElementById("myCanvas"); 
    var context = canvas.getContext("webgl"); 
    if (!context) { 
     // browser supports WebGL but initialization failed. 
     window.location = "http://get.webgl.org/troubleshooting"; 
    } 
    } 

2) zaten Three.js WebGL dedektörü vardır

3) Kontrol ayrıca Modernizr dedektörü: Three.js dedektöre https://github.com/Modernizr/Modernizr/blob/master/feature-detects/webgl.js

Answer 2

Juan Mellado en işaretçi süper faydalı oldu, ama benim projeye tüm dosyayı getirmek için tercih. Yani burada ayıklanan Detector.webgl() işlevi.

function webglAvailable() { 
    try { 
     var canvas = document.createElement("canvas"); 
     return !! 
      window.WebGLRenderingContext && 
      (canvas.getContext("webgl") || 
       canvas.getContext("experimental-webgl")); 
    } catch(e) { 
     return false; 
    } 
} 

Ve onun örneğe benzer kullanılır: tarayıcı WebGL'yi destekliyorsa başarısız olur

renderer = webglAvailable() ? new THREE.WebGLRenderer() : new THREE.CanvasRenderer();