この場合、「中学の知識で解く」のがパン。
高校の知識で解けば、パンじゃなくてケーキ。
…強引に解けば、焼き鳥。
ということで、焼き鳥解法いってみよー。
<!DOCTYPE html>
<html>
<head>
<title>a</title>
<script type="text/javascript">
onload = function(){
var canvas = document.getElementById('c');
var ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.strokeRect(0,0,1000,1000);
ctx.arc(0,500,500,0,Math.PI*2,false);
ctx.arc(1000,500,500,0,Math.PI*2,false);
ctx.stroke();
ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.fillStyle = 'white';
ctx.arc(1000,500,499,0,Math.PI*2,false);
ctx.fill();
ctx.arc(0,1000,1000,0,Math.PI*2,false);
ctx.stroke();
location.href = canvas.toDataURL();
};
</script>
</head>
<body>
<canvas id="c" width="1000" height="1000" />
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>b</title>
<script type="text/javascript">
onload = function(){
var canvas = document.getElementById('c');
var img = document.getElementById('i');
var ctx = canvas.getContext('2d');
ctx.drawImage(img,0,0);
var imgdata = ctx.getImageData(0,0,1000,1000);
var arr = imgdata.data;
var count = 0;
for(var i=0;i<1000*1000;i++){
var r = arr[i*4];
var g = arr[i*4+1];
var b = arr[i*4+2];
if (r > 200 && g < 50 && b < 50){
count += 1;
}
}
alert("" + (count/10000) + "cm^2");
};
</script>
</head>
<body>
<img src="mon.png" id="i" />
<canvas id="c" width="1000" height="1000" />
</body>
</html>
1個目のHTMLで表示された絵にmspaintで赤色を塗って、2個目のHTMLで読み込む。
あとはバカみたいにピクセルをカウントして概算。4.3751cm2。
ちなみにChromeだと「ローカルのファイルなんて汚れたもの読めるかー!(意訳)」ってエラーが出てアウト。そこはやっぱりIE。ローカルのファイルでもしっかり読んでくれる。さすがMS。
まあ、レンタルサーバとかVPS持ってればそっちに上げれば済む話なんだけど。
カテゴリからして、完全にネタ。
そもそも「数学的に解く」試みに対して「工学的にゴリ押す」わけだから、全く土俵の違う話。
ただ駄コードを書きたかっただけ。おしまい。
コメント