kazuki_nagasawa https://blog.hatena.ne.jp/kazuki_nagasawa/ 雑食性雑感雑記 https://kazuki-nagasawa.hatenablog.com/ JavaScript Canvas 先日にボールを壁に反射させるのを作った。 コレ、ボールが反射するときに弾ませてみたら面白いかなーと思い、弾ませる方法を考えてみた。 作成物 内容は前と一緒。Canvas エリアにマウスカーソルを持っていくと、mousemove イベントによりボールが生成されます。 ボールは壁に反射する際、ちょっと弾んでから反射します。 技術要素 Canvas の楕円形 楕円は――と思ったら、ellipse() で描けるんですね。便利。 短辺と長辺を設定すれば描けるとのことでちょっと実験。 短辺 = 20、長辺 = 40 とした楕円と、 両辺 20 で楕円を描いたもの、同じく両辺 40 で楕円を描いたものを並べ… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fkazuki-nagasawa.hatenablog.com%2Fentry%2Fmemo_20221121_javascript_canvas_move_points_3" title="【JavaScript &amp; Canvas】等速度運動のボールを弾ませてみる - 雑食性雑感雑記" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/k/kazuki_nagasawa/20221121/20221121092544.png Hatena Blog https://hatena.blog 2022-11-21 09:51:14 rich https://kazuki-nagasawa.hatenablog.com/entry/memo_20221121_javascript_canvas_move_points_3 1.0 100%