1 out of 3 rated this helpful - Rate this topic

stroke method

Renders the strokes of the current subpath by using the current stroke styles.

Syntax

var retval = CanvasRenderingContext2D.stroke();

Parameters

This method has no parameters.

Return value

Type: HRESULT

If this method succeeds, it returns S_OK. Otherwise, it returns an HRESULT error code.

Standards information

HTML Canvas 2D Context, Section 9

Remarks

Use the beginPath method after you call the stroke method to close the existing path and start a new one with different properties.

Examples

The following code example uses stroke to render a rectangle and an arc.

HTML


<html>
<head>
  <title>Stroke example</title>
  <script type="text/javascript">
      function draw() {
          var canvas = document.getElementById("MyCanvas");
          if (canvas.getContext) {
              var ctx = canvas.getContext("2d");
              ctx.beginPath();
              ctx.rect(5, 5, 300, 250);
              ctx.stroke();
              // ctx.beginPath();  // Uncomment this line to remove the line between the rectangle and the arc.
              ctx.arc(150, 150, 100, 0, Math.PI, false); // Create the arc path.  
              ctx.stroke();
          }
      }
  </script>
</head>
<body onload="draw();">
  <canvas id="MyCanvas" width="600" height="600">This browser or document mode doesn't support canvas</canvas> 
</body>
</html>

Community Additions

ADD