自動で再描画させる
paintイベントのたびに描画すると、HTMLの変化がCanvasへ反映されます。時計やテキスト入力、ホバーの変化がそのまま反映されることを確認してください。
操作デモ
<div>
</div>
<canvas content="drawable">
</canvas>
確認できること
Canvasの中身が動く
時計、テキスト入力、ホバーなどHTML側の変化に追従して、Canvasも自動的に描き直されます。
次のデモへ
このデモでは左上に描画
ここでは左上の決まった位置に描画しています。位置や変形を変える方法は次のデモで扱います。
デモの中心となるコード
コードを読み込んでいます…