Может ли кто-нибудь, кто использовал three.js, сказать, может ли его обнаруживать поддержку webgl и, если нет, вернуть резервную копию стандартного Canvas?
Three.js обнаруживает поддержку webgl и возвращает к регулярному холсту
Ответ 1
Да, это возможно. Вы можете использовать CanvasRenderer
вместо WebGLRenderer
.
Об обнаружении WebGL:
1) Прочитайте эту статью Wiki в WebGL: 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) У Three.js уже есть детектор WebGL: https://github.com/mrdoob/three.js/blob/master/examples/js/Detector.js
renderer = Detector.webgl? new THREE.WebGLRenderer(): new THREE.CanvasRenderer();
3) Проверьте также детектор Modernizr: https://github.com/Modernizr/Modernizr/blob/master/feature-detects/webgl.js
Ответ 2
Указатель Хуана Мелладо на детектор Three.js был очень полезен, но я предпочитаю не переносить весь файл в свой проект. Итак, вот извлеченная функция Detector.webgl().
function webglAvailable() {
try {
var canvas = document.createElement("canvas");
return !!
window.WebGLRenderingContext &&
(canvas.getContext("webgl") ||
canvas.getContext("experimental-webgl"));
} catch(e) {
return false;
}
}
И он используется аналогично его примеру:
renderer = webglAvailable() ? new THREE.WebGLRenderer() : new THREE.CanvasRenderer();