2021-05-01から1ヶ月間の記事一覧

サインカーブ

キャンバス // { let canvas = document.getElementById("graph"); ctx = canvas.getContext("2d"); paint(); }); function drawLine(x0, y0, x1, y1) { ctx.beginPath(); ctx.moveTo(x0, y0); ctx.lineTo(x1, y1); ctx.stroke(); } function paint() { ctx.…

サイン、コサインカーブ

三角関数 中心角の移動に応じて、sin/cosカーブをアニメーションで描画してみました。 キャンバス // { let canvas = document.getElementById("graph"); ctx = canvas.getContext("2d"); ctx.font = "24px sans-serif"; setInterval(tick, 10); }); functio…

三角関数

中心角とsin/cosの値を表示するアプリを作成 JavaScriptでは、Math.sin(),Math.cos()という関数が用意されているので、それを利用させてもらった。 中心角=0度 キャンバスの表示内容を説明する代替テキストです。 // 以下ソース <p><input id="theta" max="360" min="0" type="range" value="0" /> 中心角=<span id="degree">0</span>度<br /> <canvas id="graph" width="600" height="600">キャンバスの表</canvas></p>…

シンプルゲーム(重力加速度)

前回のjavascriptの重力加速度を参考にシンプルなゲームを作成しました。 マウスを押すと対象物が上に上がり、マウスを離すと対象物が下がるというシンプルなものです キャンバスの表示内容を説明する代替テキストです。 // down) { clearInterval(timer); }…

重力加速度(javascriptで実装)

重力には逆らえない。 遠投した時の軌道を書いてみた。

加速度(javascriptで実装)

加速度とは「単位時間あたりにどのくらい速度が変化するか」を表します。 加速度をjavascriptで実装してみます。

速度2(javascript実装)

前回に引き続き、速度の計算をjavascriptで実装してみる。

速度(javascript実装)

canvasの知識やゲーム作成の勉強を兼ねて、ブログに残しておきます。 まずは速度から。 一定の速度で右方向へ移動する単純なアプリからはじめよう。