格子を描画するための数式を実装する : 1. 概要 データ可視化などの際に格子状の模様を描画したくなる場合がある。自明な方法としては 縦横に等間隔の直線を描画 格子点に点をプロット などが考えられるが、もう少しだけ工夫を要する手法を紹介する。 なお、以下で紹介するのは 「平面上の座標 $(x, y)$ が与えられたとき、その地点はどのような色で塗られるべきか」という情報を与える関数 $f(x, y)$ であることに注意。形状ベースではなくピクセル塗り潰しベースの考え方であり、このような $f(x, y)$ から実際に描画をする際には Pythonであれば matplotlib.pyplot.imshow() JavaScriptであれば Canvasのピクセル値を指定する方法 などを利用すれば良い。 2. 2色のチェッカーボード まずは単純なチェッカーボード(市松模様)を描画するための関数を考える。 各正方形の長さはいったん「1」とし、任意の地点 $(x, y)$ に対して0または1の値を返す $f(x, y)$ を用意したい。 この場合、$(x, y)$ の整数部分$\lfloor x \rfloor, \lfloor y \rfloor$ について $\lfloor x \rfloor, \lfloor y \rfloor$ が(偶数,偶数)なら0 $\lfloor x \rfloor, \lfloor y \rfloor$ が(偶数,奇数)なら1 $\lfloor x \rfloor, \lfloor y \rfloor$ が(奇数,偶数)なら1 $\lfloor x \rfloor, \lfloor y \rfloor$ が(奇数,奇数)なら0 とすれば良い。例えば2で割った余りの差の絶対値をとる。 JavaScriptなら以下のように実装する。 JavaScript function checkerBoard(x, y) { return Math.abs(Math.abs(Math.floor(x) % 2) - Math.abs(Math.floor(y) % 2)); } これを利用し、各ピクセルについて「 checkerBoard(x, y) が0なら白, 1なら黒」のよ...