JavaScript-da canvas-da chiziq rangini o'zgartirish
Keling, endi kontur va to'ldirish rangini o'zgartirishni o'rganamiz.
Buning uchun quyidagi xususiyatlar mavjud:
strokeStyle xususiyati kontur rangini belgilaydi,
fillStyle xususiyati esa to'ldirish rangini belgilaydi.
Ranglar odatdagi
CSS
formatida belgilanadi.
Misol
Keling, rect yordamida kontur chizamiz
va uni qizil rangga bo'yaymiz:
<canvas width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');
ctx.rect(50, 50, 100, 100);
ctx.strokeStyle = 'red';
ctx.stroke();
:
Misol
Keling, rect yordamida kvadrat chizamiz
va uni yashil rangga bo'yaymiz:
<canvas width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');
ctx.rect(50, 50, 100, 100);
ctx.fillStyle = 'green';
ctx.fill();
:
E'tibor bering
Muhim: strokeStyle yoki fillStyle ni
o'rnatganingizda, yangi qiymat shu andan boshlab chiziladigan
barcha shakllar uchun qo'llaniladi. Boshqa rang kerak bo'lgan
har bir shakl uchun siz fillStyle yoki
strokeStyle qiymatini qayta o'rnatishingiz kerak.
