three.js 를 이용하여 3D 뷰어를 만들다 보면 화면을 가득 차게하여 크게 렌더링 해야할 때가 생긴다. 그렇게 하기 위해서는 requestFullscreen 이라는 함수를 이용 하면 간단하게 화면 채우기를 할 수 있다.
if ( document.fullscreenElement ) {
htmlElement.requestFullscreen(); // 해당 element의 함수를 호출하여 fullscreen 요청 한다.
} else if ( document.exitFullscreen ) {
document.exitFullscreen(); // 닫을 때에는 글로벌 인스턴스인 document로 요청 한다.
}- iframe 형태로 불러왔을 경우 해당 요소의 allow=”fullscreen” 속성을 지정해주면 외부에서도 최대화/최소화를 실행 할 수 있다. 속성을 설정하지 않으면 다음과 같은 메세지를 볼 수 있다.
706ea4b.js:1 Uncaught (in promise) TypeError: Disallowed by permissions policy
at HTMLDivElement.<anonymous> (706ea4b.js:1:463616)