<rect x="100" y="200" width="150" height="200" stroke="navy" stroke-width="10" fill="yellow" />
<canvas id="MYCANVAS">Browser kann kein Canvas</canvas>
<canvas id="SCHATTEN" width="300" height="100">Browser kann kein Canvas</canvas> <script> var ctx = document.getElementById("SCHATTEN").getContext("2d"); ctx.fillStyle = "rgb(192,192,192)"; ctx.fillRect(0,0, 300,100); ctx.strokeStyle = "#009"; ctx.lineWidth = "12"; ctx.strokeRect(10,10,120,80); ctx.shadowOffsetX = "5"; ctx.shadowOffsetY = "2"; ctx.shadowBlur = "8"; ctx.shadowColor = "#000"; ctx.strokeRect(160,10,120,80); </script>
[1, 0, 0] [0, 1, 0] [ti, tj, 1]
[c, s, 0] mit c = cos(w); s = sin(w); [-s, c, 0] [0, 0, 1]
[si, 0, 0] [0, sj, 0] [0, 0, 1]
[m11, m12, 0] [m21, m22, 0] [ti, tj, 1] mit i_neu = i * m11 + j * m21 + ti, j_neu = i * m12 + j * m22 + tj