動かす　わかったこと

//canvasの設定（せってい） let canvas = document.getElementById(‘canvas’); canvas.width = 1000; //canvasの横幅（よこはば） canvas.height = 1200; //canvasの縦幅（たてはば） //コンテキストを取得（しゅとく） let ctx = canvas.getContext(‘2d’); //画像（がぞう）のオブジェクトを作成 /* let img = new Image(); img.src = ‘img/figure.png’; */ //オブジェクト化して管理しやすくする let kyara = new Object(); kyara.img = new Image(); kyara.img.src = ‘img/apex_dot2.png’; kyara.x = 0; kyara.y = 0; /**********************************/ kyara.move = 0; //追加 /**********************************/ /**********************************/ //キーボードのオブジェクトも追加する// let key = new Object(); key.up = false; key.down = false; key.right = false; key.left = false; key.push = ”; /**********************************/ //メインループ function main() { //画像を表示 //オブジェクト化することで動かせるようになる。 ctx.drawImage( kyara.img, kyara.x, kyara.y ); /**********************************/ addEventListener(“keydown”, keydownfunc, false); addEventListener(“keyup”, keyupfunc, false); //方向キーが押されている場合（ばあい）は、キャラクターが移動する if ( kyara.move === 0 ) { if ( key.left === true ) { kyara.move = 32; key.push = ‘left’; } if ( key.up === true ) { kyara.move = 32; key.push = ‘up’; } if ( key.right === true ) { kyara.move = 32; key.push = ‘right’; } if ( key.down === true ) { kyara.move = 32; key.push = ‘down’; } } //kyara.moveが0より大きい場合は、4pxずつ移動（いどう）を続ける if (kyara.move > 0) { kyara.move -= 4; if ( key.push === ‘left’ ) kyara.x -= 4; if ( key.push === ‘up’ ) kyara.y -= 4; if ( key.push === ‘right’ ) kyara.x += 4; if ( key.push === ‘down’ ) kyara.y += 4; } /**********************************/ requestAnimationFrame( main ); } //ページと依存（いぞん）している全てのデータが読み込まれたら、メインループ開始 addEventListener(‘load’, main(), false); /**********************************/ //console.logから実際にキャラクターを動かすように変更 //キーボードが押されたときに呼び出される関数（かんすう） function keydownfunc( event ) { let key_code = event.keyCode; if( key_code === 37 ) key.left = true; if( key_code === 38 ) key.up = true; if( key_code === 39 ) key.right = true; if( key_code === 40 ) key.down = true; event.preventDefault(); } //キーボードが放（はな）されたときに呼び出される関数 function keyupfunc( event ) { let key_code = event.keyCode; if( key_code === 37 ) key.left = false; if( key_code === 38 ) key.up = false; if( key_code === 39 ) key.right = false; if( key_code === 40 ) key.down = false; } /**********************************/