[1일1js] HTMLCanvasElement.getContext()
https://developer.mozilla.org/ko/docs/Web/API/HTMLCanvasElement/getContext
HTMLCanvasElement.getContext()
var ctx = canvas.getContext(contextType);
var ctx = canvas.getContext(contextType, contextAttributes);
var ctx = canvas.getContext(contextType);
var ctx = canvas.getContext(contextType, contextAttributes);
동일한 캔버스 엘리먼트에서 나중에 이 메소드를 호출하면 동일한 contextType 인자와 함께 메소드가 마지막으로 호출되었을 때 반환된 것과 같이 동일한 드로잉 컨텍스트 인스턴스를 반환합니다.
=> 무슨 소리인지 잘 모르겠다 일단 더 읽어보고 다시 돌아와 보기로
파라미터
contextType
다른 드로잉 컨텍스트 객체를 얻으려면 다른 contextType을 전달하거나 다른 캔버스 엘리먼트에서 메소드를 호출해야 합니다.
=> 인자로 contextType은 필수인듯?
=> 아 여기에 들어가는게 어제 공부하면서 봤던 "2d"
다른 예시로, "webgl", "bitmaprenderer"
등이 있다.
contextAttributes
대표적인 예시로
alpha: 캔버스가 알파 채널을 포함하는지를 나타내는 불리언입니다. false로 설정할 경우, 브라우저는 이제 배경이 항상 투명하다는 것을 알기때문에 투명한 컨텐츠나 이미지를 그리는 속도를 높일수 있습니다.
반환 값
https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D
<canvas id="my-house" width="300" height="300"></canvas>
=> 내가 k-mooc에서 배웠던 그 2d 캔버스를 불러올 수 있게 된다.
=> 작업할 때 필요한 html 예시
그리고 다음 html을 가져올 js 코드 예시
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
console.log(ctx); // CanvasRenderingContext2D { ... }
Author And Source
이 문제에 관하여([1일1js] HTMLCanvasElement.getContext()), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@2taesung/1일1js-HTMLCanvasElement.getContext저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)