목록canvas (2)
동글이의 STORY
JavaScript에서 이미지를 자르기 위해 canvas를 사용하는 방법이 있다. html cavas 요소를 가져와서 쓸 수도 있고 document.createElement("canvas")로 새로 생성하여 할 수 있다.2차원 이미지인 이 캔버스에 이미지를 그리기 위해서는 getContext("2d") 메서드를 사용한다.let canvas = document.createElement("canvas"); // document.getElementById('canvas');const ctx = canvas.getContext("2d"); 이제 캔버스가 설정되고 컨텍스트가 준비되어 이미지 자르기 및 그리기를 할 수 있게 된다. Image() 생성자를 사용하여 이미지 태그를 만들고 사용할 이미지 링크를 속성에..
목차PropertiesMethodcaptureStream()getContext()toBlob()toDataURL()transferControlToOffscreen()Eventscontextlostcontextrestoredwebglcontextcreationerrorwebglcontextlostwebglcontextrestoredcanvas 요소는 그래픽 콘텐츠를 위한 컨테이너일 뿐 실제로 그림을 그리는 동작은 스크립트를 사용하여 구현해야 한다.heightwidth🟣 captureStream(frameRate)float frameRate각 프레임의 캡처 속도를 나타내는 배정밀도 부동 소수점 값설정하지 않으면 캔버스가 변경될 때 마다 새 프레임이 캡처된다.0으로 설정하면 프레임이 자동으로 캡처되지 않는다..