画像の上に矩形を描画する(HTML)

画像領域検出の可視化など、諸々の用途で「画像や写真の上に矩形を描画したいなー」ということが時々あるのでサンプルコードをメモ。

ありがちなミスとしては、矩形の描画をImage.onload の外に書いてしまって、矩形描画のあとに画像で塗りつぶされてしまうというのをやりがちなので、実行順を意識して書きましょう。