Örnek
Yazın "Hello world!" ve "Big smile!" (with gradient) tuvale kullanılarak fillText() :
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="20px Georgia";
ctx.fillText("Hello World!",10,50);
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.fillStyle=gradient;
ctx.fillText("Big smile!",10,90);
Kendin dene " Tarayıcı Desteği
Tablodaki rakamlar tam yöntemini destekleyen ilk tarayıcı sürümü belirtin.
| Yöntem | |||||
|---|---|---|---|---|---|
| fillText() | 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Tanımı ve Kullanımı
fillText() metodu tuval üzerine dolgulu metin çizer. Metnin varsayılan renk siyahtır.
Tip: kullan yazı tipini ve yazı tipi boyutunu belirlemek için özellik ve kullanımı fillStyle başka bir renk / degrade metin oluşturmak için özellik.
| JavaScript sözdizimi: | context . fillText( text,x,y,maxWidth ) ; |
|---|
Parametre Değerleri
| Parametre | Açıklama | Oynat |
|---|---|---|
| text | Tuval üzerine yazılacak metni belirtir | Oynat " |
| x | (Tuvale göreceli) metin boyama başlamak nereye x koordinatı | Oynat " |
| y | (Tuvale bağlı) metin boyama başlamak burada y koordinatı | Oynat " |
| maxWidth | İsteğe bağlı. Metnin piksel izin verilen maksimum genişlik, | Oynat " |
<Tuval Nesne