プログラミング初心者です。以下のコードはマウスの動きと同時にボールが動くようにしたいのですが、そもそも赤い球が描写されません。ご教授願います。
ちなみに、Pointはほかのファイルでfunction Point(){
this.x=0; this.y=0;} と書いてあります。
java
1コード 2let screenCanvas; 3let run=true; 4let info; 5let fps=1000/30; 6let mouse=new Point(); 7let ctx; 8let fire=false; 9 10const shot_color="red"; 11const shot_count=10; 12 13screenCanvas=document.getElementById("mycanv"); 14let ctx=screenCanvas.getContext("2d"); 15 16 17window.onload=function(){ 18 screenCanvas.addEventListener("mousemove",mouseMove,true); 19 window.addEventListener("keydown",keyDown,true); 20 screenCanvas.addEventListener("mousedown",mouseMove,ture); 21 info=document.getElementById("info"); 22 23 let chara=new character(); 24 chara.init(10); 25 26 (function(){ 27 info.innerHTML=mouse.x+":"+mouse.y; 28 29 ctx.clearRect(0,0,screenCanvas.offsetWidth,screenCanvas.offsetHeight); 30 draw(); 31 if(run){setTimeout(arguments.callee,fps);} 32 })(); 33}; 34 35 36function draw(){ 37 ctx.beginPath() 38 chara.potision.x=mouse.x; 39 chara.potision.y=mouse.y; 40 ctx.fillStyle="red"; 41 ctx.arc(chara.potision.x,chara.potision.y,chara.size,0,Math.PI*2,false); 42 ctx.fill(); 43 ctx.closePath(); 44} 45 46function mouseMove(event){ 47 mouse.x = event.clientX - screenCanvas.offsetLeft; 48 mouse.y = event.clientY - screenCanvas.offsetTop; 49 50} 51 52function mouseDown(event){ 53 fire=true; 54} 55 56function keyDown(event){ 57 let ck=event.keyCode; 58 if(ck===27){ 59 run=false; 60 } 61} 62
> window.onload=の中でなく外でfunction draw(){ボールを描く} とした後に
ctxなどはどのようにしましたか?
『即時関数内にdraw();と書くと描写されません』とのことですが、その部分のコードが見当たりませんでした。
このままではコードが読みづらいので、質問を編集し、<code>ボタンを押し、出てくる’’’の枠の中にコードを貼り付けてください
Pointはどこからもってきたのでしょうか?
即時関数内で関数が動作するかミニマムコードで確認してみては
アドバイスありがとうございます。一度やり直してみます。
質問は編集できますので適宜調整してください。
・コンソールにエラーは出ていませんか?
・JavaScriptファイルはHTMLのどこで読み込んでいますか?
エラーは出てなさそうです。
ファイルはボディータグのキャンバスタグの下で読み込んでいます。
回答1件
あなたの回答
tips
プレビュー