共通テスト2024（数学）：星型の図形 part 3

前回のあらすじ

共通テスト2014の数学の幾何学の問題（数A、数I)で、今年は星型の図形を分析する問題が出た。問題を解く前に、シミュレーターをsvg+javascriptで作ってみようと思い、プログラミングを始めた。問題の一般性を失わせずに、点A,C,P,Qをy軸に置く配置を決めたあと、自由度が２つ残る点Dをどう置くか検討し、そのうちのひとつ「点Aからの距離」の自由度を表現するプログラミングまで完成した。

今回は残りの自由度である回転を盛り込む。

回転の自由度

前回のプログラムで回転角はthetaとしてすでに導入している。ただ、角度を22度やに固定した。今回はこの縛りを外すだけなので、基本的には前回と同じ内容のプログラミングとなる。したがって、特記事項はないのでそのまま完成版をここに書いてしまおう。

要点だけまとめると、スライダーと表示窓をコピーして似たような場所に配置する。このスライダーは回転角を制御するうものにする。したがって、このスライダーの動作としてrotate()という関数を埋め込むことにする。回転角はy軸からの角度であり、点Dの位置を第２象限と第４象限に制限する（つまりy軸を超えて負の領域に行かないように制限）と、$0^\circ<\theta<90^\circ$となる。

これで一応は目的の動作が実現できたが、コードにダブりが多いので整理することにする。回転と拡大の部分で共通する計算内容をmainjob()という形の関数にして抜き出すことにする。以下のコードのような感じにする。

   function mainjob(){
      S = Number(slb1.value);
      theta = Number(slb2.value) *  PI / 180.;
      xd = Xsvg + Ssvg*S*Math.sin(theta);
      yd = Ysvg  - Ssvg*(5.0 - S*Math.cos(theta));
      pd.setAttribute('cx',xd); pd.setAttribute('cy',yd);
      lad.setAttribute('x2',xd); lad.setAttribute('y2',yd);
      td.setAttribute('x',xd+20);td.setAttribute('y',yd+20);
  }

  function rotate(){
      mainjob();
      win2.innerHTML = slb2.value;      
  }

S3:---

θ:---