JavaScriptの配列と連想配列の扱い方（宣言・要素・追加・削除）
- 更新日：
- 公開日：
こちらも自分用の備忘録としてまとめたものです。 JavaScriptの基本的な配列の宣言方法 JavaScriptではいくつかの配列の宣言方法がある。C言語のように配列長を指定せずに生成することもできる。 JavaScr […]
「javascriptプログラミング」の記事一覧
JavaScriptのCanvasとrotate()関数を使って動く時計を描画してみる
- 公開日：
まずHTML側は とした。ページ読込時にinit関数を呼び出して、そこでキャンバスの設定を行う予定。キャンバスのサイズは250×250の黄色。 init関数は以下のように。 グローバル変数でctxと、inter […]
JavaScriptのCanvasのsave()とrestore()関数の使い方
- 公開日：
キャンバスの状態を保存するsave()関数と、 保存した状態を復元するrestore()関数の使い方をやっていきます。 以下の順序でやります。 １．塗りつぶしの色と、座標系を保存して、 ２．塗りつぶしの色と、座標系を移動 […]
JavaScriptのCanvasのtranslate()関数の使い方と意味
- 公開日：
この記事の主題は「canvasのtranslateで座標の中心を移動させることができる」というこです。 ★例えば 描画領域の左上の座標は(0,0)となっているので、円を描くときに(0,0)を中心に円を描いてしまうと下図の […]
JavaScriptでサイコロ転がし – Canvasに画像（DrawImage）をランダム表示
- 更新日：
- 公開日：
スタート ストップ ソースコードは以下のようになった。 まずはHTML側。 スタートとストップボタンを表示。それぞれのボタンにonclickプロパティでstartTimer、stopTimer関数をセット。 canvas […]
スマホの画面サイズに合わせて、canvasサイズを設定する
- 公開日：
スマホの画面サイズに合わせて、canvasのサイズを設定する HTML側は以下のようにする。canvasタグをdivタグ（id=”wrapper”の）で囲っておく。 divタグはCSSで幅高さ10 […]
JavaScriptで、canvasに円弧や円を描くのと、角度（ラジアンの計算）
- 更新日：
- 公開日：
構文は以下のとおり。 arc(x, y, radius, startAngle, endAngle, anticlockwise) x,yが円の中心 radiusは半径 startAngleが開始角度。X軸方向が0度。 […]
JavaScriptのマウスのイベントmousedown、mousemove、mouseup
- 更新日：
- 公開日：
canvasにマウスでお絵描きするJavaScript。これを実現する。 マウスの現在座標をリアルタイムで取得して表示する ①addEventListenerメソッドでmousemoveを指定、第2引数で関数を入れる e […]