three.js를 사용하는 사람이 webgl 지원을 감지 할 수 있는지 알려주고, 없으면 표준 Canvas로 대체 할 수 있습니까?Three.js가 webgl 지원을 감지하고 일반 캔버스로 대체합니다.
36
A
답변
59
예, 가능합니다. WebGLRenderer
대신 CanvasRenderer
을 사용할 수 있습니다.
1)이 WebGL을 위키 기사보기 : WebGL을 감지 소개
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) 이미 Three.js를가 WebGL을 검출기가 있습니다
3) 확인도 모더 나이저 검출기 다음 Three.js를 검출기에 https://github.com/Modernizr/Modernizr/blob/master/feature-detects/webgl.js
10
후안 Mellado의 포인터는 매우 유용했다,하지만 난 내 프로젝트에 전체 파일을 가지고 있지 선호합니다. 여기에 추출 된 Detector.webgl() 함수가 있습니다.
function webglAvailable() {
try {
var canvas = document.createElement("canvas");
return !!
window.WebGLRenderingContext &&
(canvas.getContext("webgl") ||
canvas.getContext("experimental-webgl"));
} catch(e) {
return false;
}
}
그리고 자신의 예와 유사한 사용 : 브라우저가 WebGL을 지원하는 경우 실패합니다
renderer = webglAvailable() ? new THREE.WebGLRenderer() : new THREE.CanvasRenderer();
관련 문제
- 1. PGM 및 WebGL 일반 정보
- 2. Three.js가 구체의 텍스처를 표시하지 않습니다.
- 3. Three.js가 지오메트리의 중심을 이동
- 4. Three.js가 THREE.Line..etc를 다시 정의합니다.
- 5. Three.js가 레이를 사용하여 2 개의 움직이는 물체 간의 충돌을 감지합니다.
- 6. #defines constants를 대체합니다.
- 7. stream_get_contents 공백으로 더하기를 대체합니다.
- 8. three.js가 선과 입자에 대한 기하 도형을 공유합니다.
- 9. Adapter.getView를 대체합니다.
- 10. WebGL 조각 쉐이더는 outerProduct를 지원합니까?
- 11. 캔버스를 캔버스에 캔버스로 복사
- 12. 캔버스로 그림 애니메이션으로 그림
- 13. html5 캔버스로 텍스트 조작
- 14. HTML5 캔버스로 이미지 회전
- 15. scrollview에서 캔버스로 그리기 문제
- 16. 캔버스로 화면 모서리에 그리기
- 17. 캔버스로 요소 번역
- 18. View.onDraw가 잘못된 캔버스로 호출되었습니다.
- 19. 거대한 캔버스로 그림 그리기
- 20. ImageView 위에 캔버스로 그리기
- 21. 캔버스로 부드러운 선 그리기
- 22. 도메인간에 캔버스로 비디오를 그립니다.
- 23. 캔버스로 픽셀 변환
- 24. 오브젝트를 캔버스로 커브로 정렬
- 25. 캔버스로 키보드에서 입력 받기
- 26. 현재 변환이 캔버스로 적용됩니다.
- 27. 캔버스로 레이어 시뮬레이션
- 28. 캔버스로 그리기 "지그재그"
- 29. 캔버스로 뒤집는 Android 캔버스
- 30. 캔버스로 radarplot의 화살촉 회전
방법 1/3에 불과하다 (드라이버가 블랙리스트되고 같은) 어떤 이유로, 그것을 사용할 수 없습니다 왜 방법 2는 try/catch 블록이있는 함수를 사용하고 실제로 컨텍스트를 만들 수 있는지 확인합니다. –