Databases
StackOverflow2013
Postsdbo
POClick detection in a 2D isometric grid?
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POClick detection in a 2D isometric grid?
    primarykey
    data
    text
    <p>I've been doing web development for years now and I'm slowly getting myself involved with game development and for my current project I've got this isometric map, where I need to use an algorithm to detect which field is being clicked on. This is all in the browser with Javascript by the way.</p> <p><strong>The map</strong><br> It looks like <a href="http://i.stack.imgur.com/W4cPq.jpg" rel="nofollow">this</a> and I've added some numbers to show you the structure of the fields (tiles) and their IDs. All the fields have a center point (array of x,y) which the four corners are based on when drawn.<br> As you can see it's not a diamond shape, but a zig-zag map and there's no angle (top-down view) which is why I can't find an answer myself considering that all articles and calculations are usually based on a diamond shape with an angle.</p> <p><strong>The numbers</strong><br> It's a dynamic map and all sizes and numbers can be changed to generate a new map.<br> I know it isn't a lot of data, but the map is generated based on the map and field sizes.<br> - Map Size: x:800 y:400<br> - Field Size: 80x80 (between corners)<br> - Center position of all the fields (x,y) </p> <p><strong>The goal</strong><br> To come up with an algorithm which tells the client (game) which field the mouse is located in at any given event (click, movement etc).</p> <p><strong>Disclaimer</strong><br> I do want to mention that I've already come up with a working solution myself, however I'm 100% certain it could be written in a better way (my solution involves a lot of nested if-statements and loops), and that's why I'm asking here.</p> <p><a href="http://i.stack.imgur.com/h8zRj.jpg" rel="nofollow">Here's</a> an example of my solution where I basically find a square with corners in the nearest 4 known positions and then I get my result based on the smallest square between the 2 nearest fields. Does that make any sense?</p> <p>Ask if I missed something.</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. This table or related slice is empty.
    1. USDennis Rasmussen
    plurals
    1. This table or related slice is empty.
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POClick detection in a 2D isometric grid?
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POClick detection in a 2D isometric grid?
      1. USFlorian D.
      1. VTFavorite
    3. VO
      singulars
      1. POClick detection in a 2D isometric grid?
      1. This table or related slice is empty.
      1. VTUpMod
    1. COWait a minute... Are you saying that the corners of the graph in the image are not adjacent to each other?
      singulars
      1. POClick detection in a 2D isometric grid?
      1. USAlbert Perrien
    2. CO@albert if you mean whether all the cells are touching each other then yes, they are but if you're asking whether there's more outside the map then no. The images I've posted display the exact map size without any kind of scrolling or so.
      singulars
      1. POClick detection in a 2D isometric grid?
      1. USDennis Rasmussen
    3. COWell, it's a subset of a diamond shaped map. Can you use a sparse array and just cut out the corners, or whatever you don't plan to use?
      singulars
      1. POClick detection in a 2D isometric grid?
      1. USAlbert Perrien
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload