teratail
回答率
85.49%
質問するログイン新規登録
トップに関する質問マップチップの当たり判定

編集履歴

質問編集履歴

4

追記

2016/07/14 22:51

投稿

nosonosolife
nosonosolife

スコア42

test CHANGED
File without changes
test CHANGED
@@ -1,3 +1,7 @@
1
+ ※この質問は投稿し直しました[https://teratail.com/questions/41164](https://teratail.com/questions/41164)
2
+
3
+
4
+
1
5
  現在、javascriptのcanvasを使用して横スクロールアクションゲームを作成していて、
2
6
 
3
7
  キャラクターとマップの当たり判定を実装したのですが、めり込んだり、すり抜けたりなどしてしまいます。

3

スクリプト追加

2016/07/14 22:51

投稿

nosonosolife
nosonosolife

スコア42

test CHANGED
File without changes
test CHANGED
@@ -88,6 +88,14 @@
88
88
 
89
89
 
90
90
 
91
+ function collisionMap(x, y, map){
92
+
93
+ return map[Math.floor(y/16)][Math.floor(x/16)];
94
+
95
+ }
96
+
97
+
98
+
91
99
  /*
92
100
 
93
101
  当たり判定

2

大幅に変更

2016/07/14 03:45

投稿

nosonosolife
nosonosolife

スコア42

test CHANGED
File without changes
test CHANGED
@@ -1,14 +1,16 @@
1
- 現在、javascriptのcanvasを使用して横スクロールアクションゲームを作成しているのですが、キャラクターとマップの当たり判定をどうすればいいかで詰まっています。
1
+ 現在、javascriptのcanvasを使用して横スクロールアクションゲームを作成していて、
2
+
3
+ キャラクターとマップの当たり判定を実装したのですが、めり込んだり、すり抜けたりなどしてしまいます。
2
4
 
3
5
  キャラクターのサイズは31×40、
4
6
 
5
- マップチップ１つ分のサイズは32×32です。
7
+ マップチップ１つ分のサイズは16×16です。
6
8
 
7
- コードは自力で書きますので、考え方などの部分のアドバイスをよろしくお願いいたします。
9
+ どこがいけないのかをご提示いただけたら幸いです。よろしくお願いいたします。
8
10
 
9
11
 
10
12
 
11
- 【追記】マップチップというのはこういうやつです
13
+ （[このページ](http://d.hatena.ne.jp/t_tutiya/20131211/1386774368)を参考にしました。）
12
14
 
13
15
  ```javascript
14
16
 
@@ -16,36 +18,132 @@
16
18
 
17
19
  マップ
18
20
 
21
+ ※255は何もない場所
22
+
19
23
  */
20
24
 
21
- var mapChip = [
25
+ var MapChip = [
22
26
 
23
- [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
27
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
24
28
 
25
- [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
29
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
26
30
 
27
- [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
31
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
28
32
 
29
- [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
33
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
30
34
 
31
- [32,32,32,32,32,32,32,32,32,84,68,84,32,32,32,32,32,32,32,32,32,32,32,32,32],
35
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
32
36
 
33
- [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
37
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
34
38
 
35
- [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
39
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
36
40
 
37
- [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
41
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
38
42
 
39
- [32,32,32,84,32,32,84,84,68,84,84,84,68,84,84,32,32,32,32,32,32,32,32,32,32],
43
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
40
44
 
41
- [32,32,32,84,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
45
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
42
46
 
43
- [32,32,32,84,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
47
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
44
48
 
45
- [97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97],
49
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
46
50
 
47
- [113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113]
51
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
48
52
 
53
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
54
+
55
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
56
+
57
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
58
+
59
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
60
+
61
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
62
+
63
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,2,2,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
64
+
65
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
66
+
67
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
68
+
69
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
70
+
71
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
72
+
73
+ [255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
74
+
75
+ [255,2,255,255,255,255,255,255,255,255,2,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255],
76
+
77
+ [2,18,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,3,255,255,255,255,255],
78
+
79
+ [18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,19,255,255,255,255,255],
80
+
81
+ [18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,19,255,255,255,255,255],
82
+
83
+ [18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,19,255,255,255,255,255],
84
+
85
+ [18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,18,19,255,255,255,255,255],
86
+
49
- ];
87
+ ];
88
+
89
+
90
+
91
+ /*
92
+
93
+ 当たり判定
94
+
95
+ */
96
+
97
+ //床衝突判定
98
+
99
+ if (collisionMap(this.x , this.y+this.height, MapChip) != 255 ||
100
+
101
+ collisionMap(this.x+this.width, this.y+this.height, MapChip) != 255){
102
+
103
+ this.jumpFlag = false;//キャラがジャンプするフラグ
104
+
105
+ this.y = Math.floor((this.y/16)*16);
106
+
107
+ }
108
+
109
+ //天井衝突判定
110
+
111
+ else if(collisionMap(this.x , this.y, MapChip) != 255 ||
112
+
113
+ collisionMap(this.x+this.width, this.y, MapChip) != 255){
114
+
115
+ this.y = Math.floor((this.y/16)*16) + 16;
116
+
117
+ }
118
+
119
+ else{
120
+
121
+ if(this.jumpFlag == false){
122
+
123
+ this.y += 588 * delta;
124
+
125
+ }
126
+
127
+ }
128
+
129
+ //壁衝突判定（右側）
130
+
131
+ if (collisionMap(this.x, this.y , MapChip) != 255 ||
132
+
133
+ collisionMap(this.x+16, this.y+16, MapChip) != 255){
134
+
135
+ this.x = Math.floor((this.x/16)*16);
136
+
137
+ }
138
+
139
+ //壁衝突判定（左側）
140
+
141
+ if (collisionMap(this.x, this.y , MapChip) != 255 ||
142
+
143
+ collisionMap(this.x-16, this.y+16, MapChip) != 255){
144
+
145
+ this.x = Math.floor((this.x/16)*16) + 16;
146
+
147
+ }
50
148
 
51
149
  ```

1

追記

2016/07/14 03:27

投稿

nosonosolife
nosonosolife

スコア42

test CHANGED
File without changes
test CHANGED
@@ -5,3 +5,47 @@
5
5
  マップチップ１つ分のサイズは32×32です。
6
6
 
7
7
  コードは自力で書きますので、考え方などの部分のアドバイスをよろしくお願いいたします。
8
+
9
+
10
+
11
+ 【追記】マップチップというのはこういうやつです
12
+
13
+ ```javascript
14
+
15
+ /*
16
+
17
+ マップ
18
+
19
+ */
20
+
21
+ var mapChip = [
22
+
23
+ [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
24
+
25
+ [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
26
+
27
+ [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
28
+
29
+ [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
30
+
31
+ [32,32,32,32,32,32,32,32,32,84,68,84,32,32,32,32,32,32,32,32,32,32,32,32,32],
32
+
33
+ [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
34
+
35
+ [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
36
+
37
+ [32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
38
+
39
+ [32,32,32,84,32,32,84,84,68,84,84,84,68,84,84,32,32,32,32,32,32,32,32,32,32],
40
+
41
+ [32,32,32,84,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
42
+
43
+ [32,32,32,84,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32,32],
44
+
45
+ [97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97],
46
+
47
+ [113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113,113]
48
+
49
+ ];
50
+
51
+ ```