Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<body>
<canvas id="myCanvas" width=500 height=500>
  Your browser does not support the canvas tag.
</canvas>
<script type="text/javascript">  
    var canvas=document.querySelector('#myCanvas');  
    var ctx=canvas.getContext('2d');  
    
    ctx.fillStyle='#FF0000';  
    ctx.fillRect(0,0,500,500);  
    
  
    ctx.moveTo(0,0);  
    ctx.lineTo(100, 200);  
    ctx.lineTo(100,50); 
    ctx.lineTo(300,150);
    ctx.lineTo(400,300); 
    ctx.lineTo(100,400); 
    // line extremities, try "butt" and "round" values instead
    ctx.lineCap="square";
    // line joins, try "bevel", "round", and "miter" for value
    ctx.lineJoin="round";
    ctx.lineWidth=20
    ctx.strokeStyle = "#0000FF";  
    ctx.stroke();
</script>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers