投稿日: 投稿者: のんき

JavaScript (54) 新たなロケットの打ち上げ

H3ロケット初号機の打ち上げは失敗してしまいましたが、失敗から学び、次へとつなげてもらえるものと思います。

こちらのロケットは、前回のものをアップデートしつつ、いろいろな SVG / SVG.js の機能を試してみました。実行結果とソースコードはこちら。

新たなロケット
  • SVG().defs().path() で path 要素の円弧と直線を組み合わせたロケットの形を作りました。
  • ビスの位置を計算して配置しました。
  • 打ち上げ後、左へ90°回転させ、左方向へも移動しているよう星空を移動させました。
  • 回転は SVG().use().animate().rotate() を利用。

さて、宇宙への進出の次は、海に進出しようかと思います。

関連項目

“” への1件の返信

  1. ピンバック: JavaScript (55) 「の」の字 – のんきさんの年月記

コメントを残す