Uso lienzo y dibujo un área cerrada y quiero que el área se llene con algo de color. Así es como lo hago. Dibujo área cerrada con líneas.
Entonces, como resultado, tengo un área cerrada y quiero llenarla con un poco de color.
Aquí está el trozo de código que usé:
context.fillStyle = '#8ED6FF'; context.fill();Pero no funciona. Aquí está el código que uso para realizar la tarea.
<html> <head> <style> body { margin: 0px; padding: 0px; } </style> </head> <body> <canvas id="myCanvas" width="978" height="900"></canvas> <script> var canvas = document.getElementById('myCanvas'); var context = canvas.getContext('2d'); // begin custom shape context.beginPath(); // line (1) context.moveTo(10, 10); context.lineTo(190, 190); // line (2) context.moveTo(190, 190); context.lineTo(200, 280); // line (3) context.moveTo(200, 280); context.lineTo(10, 10); // here I try fill the area by color context.fillStyle = '#8ED6FF'; context.fill(); context.stroke(); </script> </body> </html>Encontré la solución.
<html> <head> <style> body { margin: 0px; padding: 0px; } </style> </head> <body> <canvas id="myCanvas" width="978" height="900"></canvas> <script> var canvas = document.getElementById('myCanvas'); var context = canvas.getContext('2d'); // begin custom shape context.beginPath(); context.moveTo(70, 70); context.lineTo(290, 290); context.lineTo(300, 380); context.closePath() context.fillStyle = '#8ED6FF'; context.fill(); context.stroke(); </script> </body> </html>