Flex2で正多角形を描画

あの福井市の小学生、その驚くべき発見とは 続きが楽しみ!!
こういう問題は、やはり手で触れられるもので工作してみるのが一番の近道ですね。
これに関連した(つもりだった)前回の自分のエントリ、「周囲の長さと面積の関係」について考えたは、かなり的外れというか、レベルの低い話だったみたいです><
4隅が集まる点をグリグリと強調してあったのに、それにも気づきませんでした…。

が、せっかくなので的を思いっきり外してFlex2で遊びながら考えてみました。

前回の、

  • あと、nが大きい方が面積が大きい。
  • nをどんどん増やしていくと円に限りなく近づく。
  • ということは、外周が同じ図形の中では、円が一番面積が大きい。

のあたりを、外周がlの正n角形に限定して、Flashで描画しつつ計ってみます。

まず、実際に動作するデモ。

Polygon Demo

外周を適当に決めて、角の数を増やしていくと面積(書き忘れましたが図形に重なっている数字)も増えていくのが見えますね。

次に、ソースコード

計算、図形描画をActionScriptで。

Polygon.as

package {
	import mx.controls.Image;

	public class Polygon extends Image {
		private var _l:Number;
		private var _n:uint;
		private var a:Number;
		private var s:Number;
		private var r:Number;
		private var h:Number;
		[Bindable]
		public var area:Number;
		
		private function calculateArea():void {
			a = 2 * Math.PI / n;
			s = l / n;
			r = s / 2 / Math.sin(a / 2);
			h = s / 2 / Math.tan(a / 2);
			area = (s * h / 2) * n;
		}
		
		private function draw():void {
			graphics.clear();
			graphics.lineStyle(1,0x666666);
			graphics.moveTo(r, 0);
			for (var i:uint = 1; i <= n; i++) {
				var x:Number = Math.cos(a * i) * r;
				var y:Number = Math.sin(a * i) * r;
				graphics.lineTo(x, y);
			}
		}
		
		public function get l():Number {
			return _l;
		}
		public function set l(length:Number):void {
			_l = length;
			calculateArea();
			draw();
		}
		
		public function get n():uint {
			return _n;
		}
		public function set n(count:uint):void {
			_n = count;
			calculateArea();
			draw();
		}
	}
	
}
外っ面をMXMLで。

Main.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:my="*"
layout="absolute" backgroundColor="0xffffff">

	<mx:HBox verticalAlign="middle" x="10" y="10">
		<mx:Label text="外周の長さが(約)" />
		<mx:NumericStepper minimum="100" maximum="500" stepSize="10" value="250" id="stepper01" />
		<mx:Label text="pxの" />

		<mx:NumericStepper minimum="3" maximum="360" value="3" id="stepper02" />
		<mx:Label text="角形" />
	</mx:HBox>

	<my:Polygon l="{stepper01.value}" n="{stepper02.value}"
		x="100" y="150" rotation="-90" id="polygon01" />
	<mx:Text text="{polygon01.area}" x="100" y="150" color="#663333" />
</mx:Application>

Polygonクラスのプロパティたち

ActionScriptソース内のプロパティたちは、先に紙に描いた絵に書き込んだ英字をそのまま使いました。

スキャナーがないので、清書しました。これです。

これに加えて、面積のarea、外周のl、角の数のnです。

この図はたまたま八角形ですが、もちろん角の数は任意。それぞれ内角の二等分線を中心まで引いている、と見てください。

絵とcalculateArea関数を見比べて、複数の合同な二等辺三角形に分けて面積を出し、それをまた足し併せて全体の面積を出していることが分かるでしょうか…。

もっとシステマチックな計算方法があるのかもしれません。ご存知の方がいらっしゃいましたら、是非ヒントをください><

まとめ。というか、再び挫折

…と、ここまではよいのですが、これは結局何の証明にもなっていませんね。

calculateArea関数の最後のarea = (s * h / 2) * n、これの右辺をlとnのみの式に戻して、「nに比例」とか「nが独立変数の二次関数」とかになれば証明できるのですが、nがtanの中に入ってしまった時点で今の自分はお手上げでした…。

やはりもう一度、数学をやり直さなければいけません><