ジェネラティブ演出
打ち上げ花火
クリック/タップした座標へロケットが打ち上がり、放物運動で必ずその位置で開花する。重力+空気抵抗で減衰するパーティクルと加算合成の発光で花火らしさを出す。
プレビュー
クリック
操作クリック/タップで動きます。
実装メモ
軌跡は背景を低アルファで塗り重ねて消しています(globalCompositeOperationをsource-overに戻してから塗るのが必須。lighterのまま塗ると軌跡が消えず残り続けます)。実ページでは打ち上げ元(sx,sy)をボタン位置や画面下端に合わせて調整してください。
コード(コピーして使えます)
<div class="fw-wrap">
<canvas class="fw-canvas" aria-hidden="true"></canvas>
<p class="fw-hint">クリックした場所へ打ち上げます</p>
</div>