მეთოდი rect

მეთოდი rect ხაზავს მართკუთხედს მოცემულ წერტილში. ეს მართკუთხედი გახდება ხილული მხოლოდ იმ შემთხვევაში, თუ გამოყენებული იქნება მეთოდი stroke ან fill. პირველ შემთხვევაში იქნება კონტური, ხოლო მეორეში - ფიგურა.

სინტაქსი

javascriptკონტექსტი.rect(x, y, სიგანე, სიმაღლე)

მაგალითი

დავხატოთ კონტური rect-ის გამოყენებით:

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
javascriptlet canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.rect(50, 50, 100, 75);
ctx.stroke();

Результат:

მაგალითი

ახლა კი დავხატოთ ფიგურა:

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
javascriptlet canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.rect(50, 50, 100, 75);
ctx.fill();

Результат:

იხილეთ აგრეთვე

  • მეთოდი fillRect,
    რომელიც ხაზავს გაფართოებულ მართკუთხედს
  • მეთოდი strokeRect,
    რომელიც ხაზავს მართკუთხედის კონტურს