مثال
رسم مستطيل. استخدام لون السكتة الدماغية الأحمر:
جافا سكريبت:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeStyle="#FF0000";
ctx.strokeRect(20,20,150,100);
انها محاولة لنفسك » دعم المتصفح
الأرقام في الجدول تحدد أول نسخة متصفح يدعم بشكل كامل العقار.
الملكية | |||||
---|---|---|---|---|---|
strokeStyle | نعم فعلا | تسعة | نعم فعلا | نعم فعلا | نعم فعلا |
تعريف واستخدام
مجموعات الملكية strokeStyle أو إرجاع اللون، التدرج، أو نمط استخدامها لالسكتات الدماغية.
القيمة الافتراضية: | # 000000 |
---|---|
جافا سكريبت بناء الجملة: | context.strokeStyle=color|gradient|pattern; |
قيم الملكية
القيمة | وصف | العبها |
---|---|---|
color | و قيمة اللون CSS الذي يشير إلى لون الحد من الرسم. القيمة الافتراضية هي #000000 | العبها " |
gradient | كائن التدرج ( linear أو radial ) تستخدم لخلق السكتة الدماغية الانحدار | |
pattern | و pattern كائن تستخدم لخلق نمط السكتة الدماغية |
المزيد من الأمثلة
مثال
رسم مستطيل. استخدام السكتة الدماغية التدرج:
جافا سكريبت:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var gradient=ctx.createLinearGradient(0,0,170,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// Fill with gradient
ctx.strokeStyle=gradient;
ctx.lineWidth=5;
ctx.strokeRect(20,20,150,100);
انها محاولة لنفسك » مثال
كتابة نص "Big smile!" ، مع السكتة الدماغية التدرج:
جافا سكريبت:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="30px Verdana";
// Create gradient
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// Fill with gradient
ctx.strokeStyle=gradient;
ctx.strokeText("Big smile!",10,50);
انها محاولة لنفسك »