HTML5 Canvas kullanarak bir dikdörtgen oluşturmak için, şekli 4 bağlantı çizgisiyle oluşturmak yerine rect() yöntemini kullanabiliriz. HTML5 Canvas dikdörtgeni x ve y parametreleriyle yerleştirilir ve genişlik ve yükseklik parametreleriyle boyutlandırılır. Dikdörtgen, sol üst köşesi etrafında konumlandırılmıştır.
Çıktı:
Kod:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <canvas id="canvas" width="578" height="200"></canvas> <script> var canvas = document.getElementById('canvas'); var context = canvas.getContext('2d'); context.beginPath(); context.rect(188, 50, 200, 100); context.fillStyle = 'yellow'; context.fill(); context.lineWidth = 7; context.strokeStyle = 'black'; context.stroke(); </script> |
Yorum Yap