#1 - Canvas (base)

by DominoPivot

HTML

<canvas id="monCanvas" width="400" height="300">
  Votre navigateur n'est pas compatible HTML5
</canvas>

CSS

canvas {
    outline: solid 1px black;
    background-color: #FFFFFF;
}

html, body {
    width: 100%;
    height: 100%;
    background-color: #DDDDDD;
}

JavaScript

var canvas = document.getElementById("monCanvas");
var ctx = canvas.getContext("2d");

// style par défaut
ctx.strokeStyle = "black";
ctx.lineWidth = 6;

// efface le canvas
function clearCanvas() {
    ctx.save();
    ctx.setTransform(1, 0, 0, 1, 0, 0);
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    ctx.restore();
}