塗りが無い枠だけの矩形を描くの巻。
HTML
<canvas id='canvas'></canvas> |
JavaScript
var canvas = document.getElementById('canvas'); var context = canvas.getContext('2d'); context.strokeStyle = '#333333'; context.strokeRect(10, 10, 290, 240); |
strokeRect
x position:int, y position:int, width:int, height:int
Option
JavaScript
var canvas = document.getElementById('canvas'); var context = canvas.getContext('2d'); context.lineWidth = 10; context.lineJoin = 'round'; context.strokeStyle = 'rgb(51, 51, 51)'; //context.strokeStyle = 'rgba(51, 51, 51, 0.5)'; context.strokeRect(10, 10, 290, 240); |
lineWidth(property):int
lineJoin(property):String
round, bevel, miter
*strokeRectで描かれる線はpathでは無い