Webノウハウ

canvasについて続編2―ミウラ折りのデモ

2021年12月18日(平石)

 何年か前、「スマホを2本指でスワイプすると、文字と画像が大きくできる。だけど、画面全体は元のサイズなので、端の方が途切れてしまう。画面も大きくなるようにできないものか。」というような会話をしました。

 ややあって、その会話と、何かで見た宇宙ステーションの発電パネルが宇宙空間で広がっていく映像とが私の頭の中で混ざってしまいました。宇宙ステーションの発電パネルは、打ち上げ時には小さく折りたたまれており、宇宙に飛び出て、ほとんど一瞬の間に、いっぱいに広がります。この折り方は、発案者三浦公亮氏の名前を採って「ミウラ折り」と呼ばれています。

 ミウラ折りは、下図の各辺で折り曲げる折り方です。各辺では折り曲げるけれど、各平行四辺形の内部では折り曲げません。そして、谷折りと山折りをうまく組み合わせることで、ほとんど瞬時に閉じたり開いたりできるのです。

     
   

 

 上図は、広げた状態の図ですが、右下の小さな赤丸の近くをクリックすると、少しだけ折った状態の図になります。そのまま、左ボタンを押したままマウスカーソルを動かすと、閉じたり開いたりできます。

 また、右側にある「軌跡の表示」ボタンをクリックすると、赤丸マークの動く軌跡が表示できます。これは、直線でも円でもありません(双曲線の一部ではなかろうかと思いますが、未確認です)。

 右下の「手動⇒自動」ボタンをクリックすると、閉じたり開いたりの動作を自動的に繰り返し表示するようになります。

 上図には、3×3=9枚のパネルが表示されています。左側に表示した縮小図の当該位置をクリックすることで、表示するパネルを2×3、3×2、あるいは2×2にすることができます。枚数が多すぎて複雑になって見づらい場合などに活用してください。

 もし動かない場合は、タイトル「canvasについて続編2―ミウラ折りのデモ」をクリックして単独表示にしてみてください。

(これは、「canvasについて」の続編です。)

Comments are currently closed.