最新的Web开发教程
 

HTML canvas createPattern() Method

<HTML画布参考

图片使用方法:

灯

水平和垂直重复图像:

YourbrowserdoesnotsupporttheHTML5canvastag。

JavaScript的:

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();
试一试»

浏览器支持

在表中的数字指定完全支持方法的第一个浏览器的版本。

方法
createPattern() 9

定义和用法

createPattern()方法重复在指定方向的元素。

该元素可以是图像,视频或其他<canvas>元素。

重复的元素可以用来绘制/填充矩形,圆线等。

JavaScript语法: context.createPattern(image,"repeat|repeat-x|repeat-y|no-repeat");

参数值

参数 描述 播放
image 指定了图像,帆布,或视频模式元件使用
repeat 默认。 图案在水平方向和垂直方向重复 播放 ”
repeat-x 该模式仅在水平方向重复 播放 ”
repeat-y 该模式只重复垂直 播放 ”
no-repeat 该模式将只显示一次(无重复) 播放 ”

<HTML画布参考