English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
fillText() is a Canvas 2The D API is a method to fill text at (x, y) position on the canvas. If the fourth parameter of the option provides a maximum width, the text will be scaled to fit the maximum width.
Manual de referencia de canvas HTML
Use fillText() to write text "Basic Tutorial Website!" and "oldtoolbag.com!":
<!DOCTYPE html> <html> <head> <meta charset="utf-8> <title>HTML canvas fillText() method usage-Basic Tutorial(oldtoolbag.com)</title>/<title> </<head> <body> <canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3> Your browser does not support HTML5 canvas tag. </canvas <script> var c=document.getElementById("myCanvas"); 2d ctx.font="20px Georgia" ctx.fillText("Basic Tutorial Website!",10,50); ctx.font="30px Verdana" // create a 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 a gradient ctx.fillStyle=gradient; ctx.fillText("w"3codebox.com!10,90); </script> </body> </html>test and see ‹/›
IEFirefoxOperaChromeSafari
Internet Explorer 9y Firefox, Opera, Chrome y Safari admiten fillText() Método.
Nota:Internet Explorer 8 y las versiones anteriores no admiten el elemento <canvas>.
Nota:Safari no admite el parámetro maxWidth.
El método fillText() dibuja texto relleno en el lienzo. El color predeterminado del texto es negro (#000000).
Consejo:Utilice font Atributo para definir el tipo de letra y el tamaño, y usar fillStyle Atributo en otro color/Renderizar texto con una transición degradada.
Sintaxis de JavaScript: | context.fillText(text,x,y,maxWidth); |
---|
Parámetro | Descripción |
---|---|
text | Texto que se especifica para la salida en el lienzo. |
x | Coordenada x del punto de partida del texto de dibujo (relativa al lienzo). |
y | Coordenada y del punto de partida del texto de dibujo (relativa al lienzo). |
maxWidth | Opcional. Ancho máximo de texto permitido, en píxeles. |