Path stroke setting style

// If you want to draw on Cavnas, you need to use JavaScript // 2 . Get the drawing tool: We can get a drawing object (context object) from the canvas tag, // Various drawing methods and settings are placed on this object. var cvs = document.getElementById('cvs') ; var ctx = cvs.getContext('2d'); // Get the canvas2d drawing tool // 3. Draw the path. ctx.moveTo(50,50); // Move the "pen" to a certain position in the image ctx.lineTo(150,50); // Use the "pen" to connect a line to a certain point ctx. lineTo(150,150); ctx.lineTo(50,150); ctx.lineTo(50,50); // There is nothing on our canvas now, why? Because moveTo and lineTo are used to draw paths. // A path is a "draft" used to describe the shape or line we want to draw // 4. Fill or stroke the path.或者 // Before the drawing or filling, we can set the color of the drawing or filling. S // Canvas is a mechanism that "the browser is regardless of him after painting", // So we want to set the drawing or filling style, we must be before the drawing or filling. After filling, setting the style will not work

ctx.strokeStyle = 'lightgreen'; // Set the stroke color to green ctx.lineWidth = 25; // Set the stroke line width ctx.stroke (); // Stroke

ctx.fillStyle = 'pink'; ctx.fill(); // Fill