canvas를 창 크기에 맞게 하는 방법

1. canvas tag 의 width, height 속성 활용
   JavaScript 사용하여 width, height 속성에 브라우저 창크기 값 부여
   그런데 이렇게 하면 canvas가 가진 px 개수 자체가 바뀐다.

2. css로 scale 조정
   쉽고, 성능면에서도 좋다. (애플에서도 이 방법을 사용한다.)

3. 모든 브라우저 기기의 창크기를 맞춰야 한다.
   기본적으로 각 기기 브라우저의 height 값에 맞춘다.
   그리고 가로정렬을 가운데 정렬해준다.
   이렇게 하면 대부분의 해상도에서 OK이다.

4. canvas 태그 안에선 parseInt로 정수변환을 해준 값들로 그려야 성능이 조금이라도 더 좋다.

5. canvas 태그에 그림은 기본적으로 검은색으로 그려진다. (default 값이기 때문)

// layout을 담당하는 setLayout 함수에 아래 코드를 넣어준다.
const heightRatio = window.innerHeight / 1080;
sceneInfo[0].objs.canvas.style.transform = `translate3d(-50%, -50%, 0) scale(${heightRatio})`