HTML 캔버스 createPattern () 메소드
이미지 사용 :
예
수평 및 수직 화상 반복 :
자바 스크립트 :
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var img=document.getElementById("lamp");
var pat=ctx.createPattern(img,"repeat");
ctx.rect(0,0,150,100);
ctx.fillStyle=pat;
ctx.fill();
var ctx=c.getContext("2d");
var img=document.getElementById("lamp");
var pat=ctx.createPattern(img,"repeat");
ctx.rect(0,0,150,100);
ctx.fillStyle=pat;
ctx.fill();
»시도
브라우저 지원
인터넷 익스플로러 9, 파이어 폭스, 오페라, 크롬과 사파리 지원 createPattern () 메소드.
참고 : 인터넷 익스플로러 8 이전 버전의 <캔버스> 요소를 지원하지 않습니다.
정의 및 사용
createPattern () 메서드는 지정된 방향으로 지정된 요소를 반복합니다.
요소는 이미지, 동영상 또는 기타 <캔버스> 요소가 될 수 있습니다.
반복되기 요소는 사각형, 원형, 광고 등을 / 그릴 채우기 위해 사용될 수있다.
| 자바 스크립트 구문 : | 문맥 .createPattern (이미지, "반복 |반복-X | 반복-Y | 노 반복"); |
|---|
매개 변수 값
| 参数 | 描述 | |
|---|---|---|
| image | 规定要使用的模式的图片、画布或视频元素。 | |
| repeat | 默认。该模式在水平和垂直方向重复。 | |
| repeat-x | 该模式只在水平方向重复。 | |
| repeat-y | 该模式只在垂直方向重复。 | |
| no-repeat | 该模式只显示一次（不重复）。 |
HTML 캔버스 참조 설명서