JavaScript アクションゲームの描画について
Q&A
Closed
解決したいこと
JavaScript(フルスクラッチ)でスーパーマリオのようなアクションゲームの画面をつくっています。
マップを描画する画面の実装中にエラーが発生しました。
解決方法を教えて下さい。
発生している問題・エラー
出ているエラーメッセージを入力
```なし
例)
NameError (uninitialized constant World)
または、問題・エラーが起きている画像をここにドラッグアンドドロップ
### 該当するソースコード
```言語名はJavaScript
let canvas=document.getElementById("canvas");
let ctx=canvas.getContext("2d");
let width=16; //横幅
let height=12; //縦幅
let size=32; //サイズ
canvas.width=width*size;
canvas.height=height*size;
canvas.style.border="1px solid brack";
let field=[
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
]
//描画処理
function draw(){
for(let i=0; i<height; i++){
for(let j=0; j<width; j++){
if(field[i][j]==1){
ctx.fillstyle="red";
}else if(field[i][j]==0){
ctx.fillstyle="white";
}
ctx.fillRect(j*size,i*size,size,size);
}
}
}
draw();
例)
console.log("Hello! world.");
自分で試したこと(というか追記)
どうやらスペルミスだったようです(苦笑)
正:fillStyle
誤:fillstyle
どうりで黒く塗り潰された訳だ。
みんなもスペルミスには気を付けましょう
0