Doubts in javascript collisions

Navigation
1

I'm starting to program now, and I have the task of making a simple control with the keyboards in a "map" that is an image, and the cart can not cross the streets, the map is the attached image but I'm not being able to think of a logic to make the collisions using the x / y coordinates the areas in green, that is, everything that is not the street the cart can not walk my cart has size 40x20 pixels.

PS: I do not want the code ready, I want an aid to think of logic or some easier way of doing it, using x / y

    
asked by anonymous 19.09.2017 / 07:17

2 answers

0

I've done something like this. But I had to create a scenario like this with squares, each square representing something that could collide or not.

In your case, you could separate this image into small squares, trying to separate as much as possible from the asphalt. And in your code you assemble the image, and each square with asphalt you assign a value. When you go with the car in the image, you check if it is colliding with the amount that is on the asphalt, otherwise it will not let you move.

There are easier ways and tools to do this, but as it is for your study, this is a great task.

Good luck!

    
19.09.2017 / 07:30
1

From this image, generate a new image, where the streets are white and the rest is black. The idea is as follows, where it is white, you can go where it is black is blocked. Whenever you want to move the cart you check this image, firstly, if the new position remains in the white position. If yes, you move, otherwise you reject the movement (collision)

    
19.09.2017 / 13:55
When the keyboard is hidden space is not rendered How to put input and label side by side with bootstrap?