Solved

JS Matrix question

Posted on 2009-04-12
12
239 Views
Last Modified: 2012-06-27
I am making a simple game. It is a grid 8x8 , the good guy occupies on square, the bad guy another.

I need to make sure when the good guy chooses his initial square that my script does not put the bad guy within 4 squares of him.

I am stumped on how to do this!

Can anyone give me an example????
0
Comment
Question by:edvinson
  • 4
  • 4
  • 3
  • +1
12 Comments
 
LVL 41

Expert Comment

by:HonorGod
ID: 24125759
Given row, and column values (each from 1 to 8) you can use the following to determine the distance.


  function distance( r1, c1, r2, c2 ) {
    var a = Math.abs( r1 - r2 )
    var b = Math.abs( c1 - c2 )
    return Math.floor( Math.sqrt( ( a * a ) + ( b * b ) ) )
  }

Open in new window

0
 
LVL 13

Expert Comment

by:numberkruncher
ID: 24126196
Just in case you are wondering how HonorGod came up with that function:

The function uses the "distance" formula which is a derivative of Pythagoras' Theorm (http://en.wikipedia.org/wiki/Pythagorean_theorem).
0
 
LVL 31

Expert Comment

by:GwynforWeb
ID: 24127582
You are on a grid, I think you want this measure of distance

 function distance( x1, y1, x2, y2 ) {
    var dx = Math.abs( x1 - x2 )
    var dy = Math.abs(y1 - y2 )

    if ( a > b) return a + Math.abs( a - b )
        else     return b + Math.abs( a - b )

  }
0
Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
LVL 31

Expert Comment

by:GwynforWeb
ID: 24127589
gah!!  sorry I have it the wrong way round, it should read

 function distance( x1, y1, x2, y2 ) {
    var dx = Math.abs( x1 - x2 )
    var dy = Math.abs(y1 - y2 )

    if ( a < b) return a + Math.abs( a - b )
        else     return b + Math.abs( a - b )

  }
0
 
LVL 31

Accepted Solution

by:
GwynforWeb earned 300 total points
ID: 24127605
OK now I am messing this thread up with my typos. I am so sorry. Since you are a grid the answer is this. (final answer)

 function distance( x1, y1, x2, y2 ) {
    var a= Math.abs( x1 - x2 )
    var b = Math.abs(y1 - y2 )

    if ( a > b)  return a
        else     return b

  }

ie the min distance you travel is the max of the differences in the coordinates.
0
 
LVL 13

Assisted Solution

by:numberkruncher
numberkruncher earned 200 total points
ID: 24127663
I am not sure what GwynforWeb's solution is supposed to do as it completely ignores the variables dx and dy??

When using radial collision detection (i.e. making sure that a bad guy is not placed within 4 squares of good guy) then you simply need to check the distance.

So (using the image as an example):

Good (3, 3)           (col, row)
A (1, 1)
B (4, 2)
C (8, 5)

distance from Good to A = 2
distance from Good to B = 1
distance from Good to C = 5

Your code simply needs to enumerate the grid whilst comparing distance. The following is an example of how you could do this.
function isCellEmpty(col, row) {
   // Return false if there is an enemy or player in cell!
   return true;
}
 
function findPosition(playerPos) {
    for (var ri = 0; ri < 8; ++ri)
        for (var ci = 0; ci < 8; ++ci)
            if (isCellEmpty(ci, ri) && distance(ri, ci, playerPos.r, playerPos.c) >= 4)
                return { r: ri, c: ci};
 
    // No places available!
    return null;
}
 
function foo() {
    var playerPos = { r: 2, c: 2 };
    var enemyPos = findPosition(playerPos);
}

Open in new window

dist.jpg
0
 
LVL 41

Expert Comment

by:HonorGod
ID: 24127680
Gwen, you're right. This is correct

function D2( r1, c1, r2, c2 ) {
  return Math.max( Math.abs( r1 - r2 ), Math.abs( c1 - c2 ) )
}


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title> 8 x 8 </title>
</head>
<body>
<script type='text/javascript'>
  function D1( r1, c1, r2, c2 ) {
    var a = Math.abs( r1 - r2 )
    var b = Math.abs( c1 - c2 )
    return Math.floor( Math.sqrt( ( a * a ) + ( b * b ) ) )
  }
 
  function D2( r1, c1, r2, c2 ) {
    return Math.max( Math.abs( r1 - r2 ), Math.abs( c1 - c2 ) )
  }
 
  function init() {
    var total = diff = 0
    for ( var r1 = 1; r1 < 9; r1++ ) {
      for ( var c1 = 1; c1 < 9; c1++ ) {
        for ( var r2 = 1; r2 < 9; r2++ ) {
          for ( var c2 = 1; c2 < 9; c2++ ) {
            if ( ( r1 != r2 ) || ( c1 != c2 ) ) {
              var d1 = D1( r1, c1, r2, c2 )
              var d2 = D2( r1, c1, r2, c2 )
              if ( d1 != d2 ) {
                document.write( r1 + ', ' + c1 + ' ' + r2 + ', ' + c2 + ' ' + d1 + ' ' + d2 + '<br>' )
                diff++
              }
              total++
            }
          }
        }
      }
    }
    document.write( '<br><br>Total = ' + total + '  diff = ' + diff )
  }
  init()
</script>
</body>
</html>

Open in new window

0
 
LVL 31

Expert Comment

by:GwynforWeb
ID: 24127779
If movement is between grid cells and diagonal movement is allowed then numberkruncher's diagram  seems wrong. And my solution of the max of the difference in the 2 coords is correct.
0
 
LVL 13

Expert Comment

by:numberkruncher
ID: 24127791
GwynforWeb:  Yes, your 3rd response for maximum difference is correct; your earlier two responses didn't make a lot of sense, but you corrected those whilst I was writing my response.

Both approaches work, but GwynforWeb's approach uses less processing power.

I cannot see any problems with the diagram...
0
 
LVL 1

Author Comment

by:edvinson
ID: 24163326
as i am fairly new to game prog, can anyone tell me which solution would be best for just passing the good guy coords and the bad guys?
0
 
LVL 41

Expert Comment

by:HonorGod
ID: 24164196
I am biased, and would vote for http://#a24127605 with partial credit to
http:#//a24127680 and http://#a24127663 (for the nice graphics)
0
 
LVL 41

Expert Comment

by:HonorGod
ID: 24164202
Drat, wrong format for links...  How about:
http:#a24127605 with partial credit to http:#a24127680 and http:#a24127663 (for the nice graphics)
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article shows how to create and access 2-dimensional arrays in JavaScript.  It includes a tutorial in case you are just trying to "get your head wrapped around" the concept and we'll also look at some useful tips for more advanced programmers. …
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

830 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question