読者です 読者をやめる 読者になる 読者になる

3つの円の隙間に円を描く

図形を描く系のコードでやっている計算を図解するシリーズ。

(Illustrator用のJavaScript script編)

これは基礎知識級のことなのかもしれないのですが、
私は初めて知って面白いと思ったので、

本題

1. 同じ大きさの3円の場合

f:id:shspage:20170331233303p:plain

同じ大きさの円を3つ適当に描いたとき、3つの円に接する円が描けます。
(3円が直線上に並んでいるときを除く。)

こんなふうに。

f:id:shspage:20170331233321p:plain

しくみ

3つのうち2つの円に接する円の中心は、 2円の中心から等距離の点の軌跡、 つまり2円の中心を結んだ線の垂直二等分線上にあります。

f:id:shspage:20170331233432p:plain

中心を結んで三角形をつくると、 各辺の垂直二等分線の交点は三角形の外心(外接円の中心)なので、 3円に接する円の中心が1点に決まるのは当然といえば当然なわけです。

f:id:shspage:20170331233502p:plain

仕組みが分かると詰まらない気もしますが、 ブログの性格上、スクリプトにしたものを掲載します。

gist.github.com

円が重なってる場合はこんなふうになっちゃいますねこれ。

外側で接するとは言ってないからこれもアリか。

f:id:shspage:20170331234442p:plain

2. 違う大きさの3円の場合

雰囲気的には描けそうなんですが、これが思ったより難しく、

調べたらこれは「アポロニウスの問題」というものだそうで、 ネット上で色々な解法が見つけられますがどれもややこしいです。

手に負えそうな解法のひとつを参考にさせていただき、 スクリプトにしてみましたが、このシリーズに載せるには複雑になってしまいました。 内容はまた何かの機会に図解したいと思います。

Illustratorで3円に接する円を描く · GitHub

1つだけ補足すると、3円に接する円の半径を大きく(or小さく)した場合、 3円のほうの半径を同じ分だけ小さく(or大きく)すると接した状態が保たれる のだそうで(アポロニウスの問題 - Wikipedia )、スクリプトに使った解法でもこの事実を利用しています。

上の「1.」でやっていることも、三角形の外接円に接する頂点を半径0の円と 考えると、3つの円に接するケースはそれらの半径を増やしただけのことともいえます。


おわび】前回、脚注2で円の中心と半径を簡単に求める方法として 載せたものが間違っていたため修正しました。