Road Sign Square
Jump to navigation
Jump to search
Almost
- The yellow square has side 150, the radius of the corner is 40.
- The black square is 100, the line width is 16.
- The yellow is rgb(255,227,0)
function drawFlag(ctx){ ctx.fillStyle = 'rgb(255,227,0)'; ctx.fillRect(0,0,150,150); ctx.lineWidth = 16; ctx.strokeStyle = 'black'; ctx.moveTo( 25, 25); ctx.lineTo(125, 25); ctx.lineTo(125,125); ctx.lineTo( 25,125); ctx.closePath(); ctx.stroke(); }
function drawFlag(ctx){ ctx.fillStyle = 'rgb(255,227,0)'; ctx.fillRect(0,0,150,150); ctx.lineWidth = 16; ctx.strokeStyle = 'black'; ctx.moveTo( 25, 25); ctx.lineTo(125, 25); ctx.lineTo(125,125); ctx.lineTo( 25,125); ctx.closePath(); ctx.stroke(); }
Get it right
- The yellow square has side 150, the radius of the corner is 40.
- The black square is 100, the line width is 16.
- The yellow is rgb(255,227,0)
function drawFlag(ctx){ ctx.fillStyle = 'rgb(255,227,0)'; ctx.fillRect(0,0,150,150); ctx.lineWidth = 16; ctx.strokeStyle = 'black'; ctx.moveTo( 25, 25); ctx.lineTo(125, 25); ctx.lineTo(125,125); ctx.lineTo( 25,125); ctx.closePath(); ctx.stroke(); }
function drawFlag(ctx){ ctx.fillStyle = 'rgb(255,227,0)'; ctx.fillRect(0,0,150,150); ctx.lineWidth = 16; ctx.strokeStyle = 'black'; ctx.moveTo( 25, 25); ctx.lineTo(125, 25); ctx.lineTo(125,125); ctx.lineTo( 25,125); ctx.closePath(); ctx.stroke(); }