Canvas strokeStyle အချက်အလက်

Canvas 参考手册

အသုံးပြုခြင်း နှင့် အမှုသန်းခြင်း

strokeStyle အချက်အလက် ဖြင့် အရိုက် အဆင်းရောင်၊ အဆင်းရောင် အရိုက် သို့မဟုတ် ပုံအရိုက် ကို စစ်ဆေး သို့မဟုတ် ကျွမ်းကျွမ်းချွမ်းကျွမ်းခြင်း ပြုလုပ်

အမှတ်

အမှတ် 1

ပုံမှု တစ်ခု ဖန်တီးပါ အရိုက် အဆင်းရောင် အား မြင်းမြင်း အစီးအစဉ် အဖြင့် ဖော်ပြပါ

သင်၏ ဘရောက်တာ က ကျွန်ပ် လက္ခဏာ ကို ထောက်ပံ့ခြင်း မရှိပါ။

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeStyle="#0000ff";
ctx.strokeRect(20,20,150,100);

ကိုယ်တိုင် ကြိုးစားကြည့်တော့ပါ

ဘာသာ

context.strokeStyle=color|gradient|pattern;

အချက်အလက်

ပြင့် ဖော်ပြ
color ပြုလုပ် အရိုက် အဆင်းရောင် ကို ညွှန်ပြ CSS အဆင်းရောင် တည်းဟု。မူကွဲ အဆင်းရောင် အား #000000 ဖြင့် ကျွမ်းကျွမ်းချွမ်းကျွမ်းခြင်း ဖြင့် ဖော်ပြပါ
gradient ပြုလုပ် ပြီး အပြုံးပိုင်း ပြုလုပ် အချက်အလက် အတွက် အဆင်းရောင် အရိုက် အား အသုံးပြုအဆင်းရောင်သို့မဟုတ်ရောပ်လျက်）。
pattern အဆင်းရောင် အရိုက် ပြုလုပ် အချက်အလက် အတွက် ပုံအရိုက် အစီအစဉ် အား ဖန်တီး

နည်းပါး အချက်အလက်

မူကွဲ #000000

ပိုမိုကြည့်ရန်

အမှတ် 2

ပုံရိုး အရိုက် အစီအစဉ် အဖြင့် ပုံမှု တစ်ခု ဖန်တီးပါ

သင်၏ ဘရောက်တာ က ကျွန်ပ် လက္ခဏာ ကို ထောက်ပံ့ခြင်း မရှိပါ။

JavaScript:

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");
// အဆင်းရောင် အရိုက် ပြုလုပ်
ctx.strokeStyle=gradient;
ctx.lineWidth=5;
ctx.strokeRect(20,20,150,100);

ကိုယ်တိုင် ကြိုးစားကြည့်တော့ပါ

အမှတ် 3

အဆင်းရောင် အရိုက် အစီအစဉ် ဖြင့် စကတ္ထုပုံ အမှတ် "codew3c.com" ကို ရေးသားပါ

သင်၏ ဘရောက်တာ က ကျွန်ပ် လက္ခဏာ ကို ထောက်ပံ့ခြင်း မရှိပါ။

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="30px Verdana";
// အဆင်းရောင် အရိုက် ဖန်တီး
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// အဆင်းရောင် အရိုက် ပြုလုပ်
ctx.strokeStyle=gradient;
ctx.strokeText("Big smile!",10,50);

ကိုယ်တိုင် ကြိုးစားကြည့်တော့ပါ

ဘရောက်တာ ကူညီ

ပြင်ပတ်ထဲရှိ စကတ္ထုပုံ အချက်အလက်များ က အပြော်ဆိုချက်မှ ပထမပေါ့ပေါ့ခြင်း စက်သုံး ကွန်ပျူတာ မူကွဲ အပါအဝင် ကို ညွှန်ပြသည်။

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

注释：Internet Explorer 8 以及更早的版本不支持 元素。

Canvas 参考手册