Ö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() | Evet | 9.0 | Evet | Evet | Evet |
Note: MaxWidth parametresi Safari 5.1 ve önceki sürümlerinde desteklenmez.
Tanımı ve Kullanımı
fillText() metodu tuval üzerine dolgulu metin çizer. Metnin varsayılan renk siyahtır.
Tip: kullan font 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 " |