1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
|
<!DOCTYPE html>
<html>
<body>
<canvas id="A" width=200 height=50></canvas><br />
<canvas id="B" width=200 height=50></canvas>
<script>
var canvasA = document.getElementById("A"),
ctxA = canvasA.getContext('2d'),
canvasB = document.getElementById("B"),
ctxB = canvasB.getContext('2d'),
width = canvasA.width,
height = canvasA.height;
ctxA.fillStyle = 'red';
ctxA.fillRect(0, 0, width, height);
var pat = ctxB.createPattern(canvasA, "repeat");
ctxA.clearRect(0, 0, width, height);
ctxB.fillStyle = pat;
ctxB.fillRect(0, 0, width, height);
</script>
</body>
</html>
|
