HTML ကျွန်း စကား

ဖန်တီးရိုက်ချက် ပေါ်တွင် စာလုံး ပြုလုပ်

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

  • font - စာလုံး အမျိုးအစား အကိုးအကာ
  • fillText(text,x,y) - ဖန်တီးရိုက်ချက် ပေါ်တွင် "လက်ခံစားရေး ပြုလုပ် စာလုံး" ပြုလုပ်
  • strokeText(text,x,y) - ဖန်တီးရိုက်ချက် ပေါ်တွင် စာလုံး ပြုလုပ် (လက်ခံစားရေး မပါ)

fillText() ကို အသုံးပြုပါ

အမှတ်

စကားလုံး "30px Arial" ကို ဖျော်ဖြေပြီး ဖန်တီးရိုက်ချက် ပေါ်တွင် လက်ခံစားရေး ပြုလုပ်ပါ:

သင်၏ ဘရောက်တာ က HTML5 ကုလသမဂ္ဂ ဂရောသ် ကို ထောက်ပံ့ခြင်း မရှိပါဘူး。

JavaScript:

const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.font = "30px Arial";
ctx.fillText("Hello World", 10, 50);

亲自试一试

strokeText() ကို အသုံးပြုပါ

အမှတ်

စကားလုံး "30px Arial" ကို ဖျော်ဖြေပြီး ဖန်တီးရိုက်ချက် ပေါ်တွင် စာလုံး ပြုလုပ်ပါ (လက်ခံစားရေး မပါ):

သင်၏ ဘရောက်တာ က HTML5 ကုလသမဂ္ဂ ဂရောသ် ကို ထောက်ပံ့ခြင်း မရှိပါဘူး。

JavaScript:

const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.font = "30px Arial";
ctx.strokeText("Hello World", 10, 50);

亲自试一试

အရေးယူထား ပြီး အလယ်တွင် စာလုံး ပြုလုပ်ပါ

အမှတ်

စကားလုံး "30px Comic Sans MS" ကို ဖျော်ဖြေပြီး ဖန်တီးရိုက်ချက် အလယ်တွင် လက်ခံစားရေး ပုံစံ ပြုလုပ်ပါ:

သင်၏ ဘရောက်တာ က HTML5 ကုလသမဂ္ဂ ဂရောသ် ကို ထောက်ပံ့ခြင်း မရှိပါဘူး。

JavaScript:

const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.font = "30px Comic Sans MS";
ctx.fillStyle = "red";
ctx.textAlign = "center";
ctx.fillText("Hello World", canvas.width/2, canvas.height/2);

亲自试一试

另请参阅:

CodeW3C.com 的完整 Canvas 参考手册