Improve company productivity with a Business Account.Sign Up

x
?
Solved

JS Matrix question

Posted on 2009-04-12
12
Medium Priority
?
263 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: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say 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 1200 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 800 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: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

This article discusses how to implement server side field validation and display customized error messages to the client.
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
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…

606 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