Chromium Code Reviews Chromium Code Reviews
Issue 14298022:
Add support for new canvas ellipse method. (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master| Index: LayoutTests/fast/canvas/canvas-ellipse-circumference.html |
| diff --git a/LayoutTests/fast/canvas/canvas-ellipse-circumference.html b/LayoutTests/fast/canvas/canvas-ellipse-circumference.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..f085737b81f554d4e619451772d0f24000b0b1a4 |
| --- /dev/null |
| +++ b/LayoutTests/fast/canvas/canvas-ellipse-circumference.html |
| @@ -0,0 +1,100 @@ |
| +<!DOCTYPE html> |
| +<html> |
| +<head></head> |
| +<body> |
| +<canvas id="mycanvas" width="400" height="200"></canvas> |
| +<script> |
| +//This tests checks that ellipse can draw correct circumferences with lineTo. |
| +var canvas = document.getElementById('mycanvas'); |
| +var ctx = canvas.getContext('2d'); |
| + |
| +ctx.lineWidth = 7; |
| +ctx.fillStyle = 'rgb(255, 255, 255)'; |
| +ctx.strokeStyle = 'rgb(0, 0, 0)'; |
| +ctx.fillRect(0, 0, canvas.width, canvas.height); |
| + |
| +// Check clockwise circumference. |
| +// 1. sweepAngle == 2PI |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.ellipse(60, 50, 30, 20, Math.PI / 6, -Math.PI, Math.PI, false); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
|
alph
2013/07/10 13:38:04
Again, as for the arc test, I suggest drawing a 2d
dshwang
2013/07/10 14:19:57
Yes, I think your idea is great.
|
| + |
| +// 2. sweepAngle == PI |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.ellipse(60, 50, 30, 20, Math.PI / 6, -Math.PI, 0, false); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +// 3. sweepAngle > 2PI |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.ellipse(60, 50, 30, 20, Math.PI / 6, -Math.PI, Math.PI * 2.5, false); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +// 4. sweepAngle < 0 |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.ellipse(60, 50, 30, 20, Math.PI / 6, Math.PI * 1.5, -Math.PI, false); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +// Check anticlockwise circumference. |
| +// 1. sweepAngle == 2PI |
| +ctx.translate(-300, 100); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.ellipse(60, 50, 30, 20, Math.PI / 6, Math.PI, -Math.PI, true); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +// 2. sweepAngle == PI |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.ellipse(60, 50, 30, 20, Math.PI / 6, Math.PI, 0, true); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +// 3. sweepAngle > 2PI |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.ellipse(60, 50, 30, 20, Math.PI / 6, Math.PI, Math.PI * -1.5, true); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +// 4. sweepAngle < 0 |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.ellipse(60, 50, 30, 20, Math.PI / 6, Math.PI * -1.5, Math.PI, true); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +</script> |
| +</body> |
| +</html> |
| + |
