OLD | NEW |
1 description("This tests canvas full arc fill with nonzero winding rule. Eight gr
een concentric thick circumferences should be displayed."); | 1 description("This tests canvas full arc fill with nonzero winding rule. Eight gr
een concentric thick circumferences should be displayed."); |
2 | 2 |
3 var canvas = document.createElement('canvas'); | 3 var canvas = document.createElement('canvas'); |
4 document.body.appendChild(canvas) | 4 document.body.appendChild(canvas) |
5 canvas.setAttribute('width', '300'); | 5 canvas.setAttribute('width', '300'); |
6 canvas.setAttribute('height', '150'); | 6 canvas.setAttribute('height', '150'); |
7 var ctx = canvas.getContext('2d'); | 7 var ctx = canvas.getContext('2d'); |
8 | 8 |
9 var r; | 9 var r; |
10 var anticlockwise = true; | 10 var anticlockwise = true; |
11 ctx.beginPath(); | 11 ctx.beginPath(); |
12 for (r = 200; r >= 10; r -= 10) { | 12 for (r = 200; r >= 10; r -= 10) { |
13 ctx.moveTo(150 + r, 75); | 13 ctx.moveTo(150 + r, 75); |
14 ctx.arc(150, 75, r, 0, Math.PI*2, anticlockwise); | 14 ctx.ellipse(150, 75, r, r * 1.2, 0, 0, Math.PI * 2, anticlockwise); |
15 ctx.closePath(); | 15 ctx.closePath(); |
16 anticlockwise = !anticlockwise; | 16 anticlockwise = !anticlockwise; |
17 } | 17 } |
18 ctx.fillStyle = 'rgba(0, 255, 0, 1)'; | 18 ctx.fillStyle = 'rgba(0, 255, 0, 1)'; |
19 ctx.strokeStyle = 'rgba(0, 255, 0, 1)'; | 19 ctx.strokeStyle = 'rgba(0, 255, 0, 1)'; |
20 ctx.fill(); | 20 ctx.fill(); |
21 ctx.stroke(); | 21 ctx.stroke(); |
22 | 22 |
23 var imageData = ctx.getImageData(297, 75, 1, 1); | 23 var imageData = ctx.getImageData(297, 75, 1, 1); |
24 var data = imageData.data; | 24 var data = imageData.data; |
25 shouldBe("data[0]", "0"); | |
26 shouldBe("data[1]", "0"); | 25 shouldBe("data[1]", "0"); |
27 shouldBe("data[2]", "0"); | |
28 | 26 |
29 imageData = ctx.getImageData(285, 5, 1, 1); | 27 imageData = ctx.getImageData(295, 144, 1, 1); |
30 data = imageData.data; | 28 data = imageData.data; |
31 shouldBe("data[0]", "0"); | |
32 shouldBe("data[1]", "255"); | 29 shouldBe("data[1]", "255"); |
33 shouldBe("data[2]", "0"); | |
34 | 30 |
35 imageData = ctx.getImageData(277, 75, 1, 1); | 31 imageData = ctx.getImageData(272, 144, 1, 1); |
36 data = imageData.data; | 32 data = imageData.data; |
37 shouldBe("data[0]", "0"); | 33 shouldBe("data[1]", "255"); |
| 34 |
| 35 imageData = ctx.getImageData(262, 144, 1, 1); |
| 36 data = imageData.data; |
38 shouldBe("data[1]", "0"); | 37 shouldBe("data[1]", "0"); |
39 shouldBe("data[2]", "0"); | 38 |
| 39 imageData = ctx.getImageData(239, 144, 1, 1); |
| 40 data = imageData.data; |
| 41 shouldBe("data[1]", "0"); |
| 42 |
| 43 imageData = ctx.getImageData(228, 144, 1, 1); |
| 44 data = imageData.data; |
| 45 shouldBe("data[1]", "255"); |
OLD | NEW |