Podemos dibujar texto (sin relleno) en el lienzo usando el método strokeText(). Básicamente, a partir de este método podemos representar el texto especificado en la posición especificada usando la fuente actual, el ancho de línea y la propiedad strokeStyle. El color predeterminado de el texto es negro.
Sintaxis:
context.strokeText(text, x, y, maxWidth);
Valor del parámetro : este método acepta cuatro parámetros que se mencionan anteriormente y se describen a continuación:
- texto: este parámetro especifica el texto que se escribirá en el lienzo.
- x: este parámetro especifica la coordenada horizontal para comenzar a pintar el texto, en relación con el lienzo.
- y: este parámetro especifica la coordenada vertical para comenzar a pintar el texto, en relación con el lienzo.
- maxWidth: este parámetro especifica el ancho de texto máximo posible.
Ejemplo 1: El siguiente ejemplo ilustra el método strokeTex().
<!DOCTYPE html>
<html>
<head>
<title>
HTML canvas strokeText() Method
</title>
</head>
<body>
<center>
<h1 style="color:green">
GeeksforGeeks
</h1>
<h4>
HTML canvas strokeText() Method
</h4>
<canvas id="GFG" width="500" height="200">
</canvas>
<script>
var c = document.getElementById("GFG");
var ctx = c.getContext("2d");
ctx.font = "60px Arial";
ctx.strokeStyle = "green";
ctx.strokeText("GeeksforGeeks", 50, 50);
</script>
</center>
</body>
</html>
Producción:
Ejemplo 2:
<!DOCTYPE html>
<html>
<head>
<title>
HTML canvas strokeText() Method
</title>
</head>
<body>
<center>
<h1 style="color:green">
GeeksforGeeks
</h1>
<h4>
HTML canvas strokeText() Method
</h4>
<canvas id="GFG" width="500" height="200">
</canvas>
<script>
var c = document.getElementById("GFG");
var ctx = c.getContext("2d");
ctx.font = "60px Georgia";
ctx.strokeStyle = "blue";
ctx.strokeText("HTML Canvas", 60, 50);
</script>
</center>
</body>
</html>
Salida: 
navegadores compatibles: los navegadores compatibles con el método HTML canvas strokeText() se enumeran a continuación:
- Google Chrome
- Internet Explorer 9.0
- Firefox
- Ópera
- Safari
Publicación traducida automáticamente
Artículo escrito por IshwarGupta y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA