4

I am working on a game written in javaScript / jQuery. Part of my code draws a random polygon (an island) on a tile grid. I need to check if a point is inside the polygon.

I am using a point-in-polygon intersection script which I found in several places on Stack Overflow (original here). This works fine in Firefox. In Chrome, there are points inside the polygon which the script says are not inside it.

In Firefox: enter image description here

In Chrome (the island is different because they are randomly generated): enter image description here

Please take a look at the source here, particularly the pointPolygonIntersect function: Point in Polygon Hit Test

Can anyone figure out why this is happening? The original script is in C, and I am using a JavaScript version - could this be causing the problem?

Community
  • 1
  • 1
shipshape
  • 1,682
  • 2
  • 17
  • 33
  • The test `pointPolygonIntersect()` is fairly simple, so you must be getting different data between the browsers. Probably be easier to see if you dump the data on both browsers and compare them. – Orbling Jun 29 '11 at 23:55
  • Thanks... it might very well be something besides pointPolygonIntersect. I have been trying to find differences in the data but so far haven't found any. – shipshape Jun 30 '11 at 02:16

2 Answers2

2

Pick an island and stick with it. Trace the code in both browsers and see where they differ. There's no reason to fight against the randomness that you can easily remove...

Jonathan
  • 1,487
  • 11
  • 12
  • 1
    For test purposes, this is sensible. – Orbling Jun 30 '11 at 08:24
  • Thanks, this advice helped me figure out the problem. I'm still not sure exactly what is going on, but the differences are happening in the function which sorts the array of polygon points and removes duplicate values. I've found another way to do that which does not cause this issue. – shipshape Jun 30 '11 at 16:28
  • LOL, maybe I will use this phenomenon to create patches of terrain on my islands. :) – shipshape Jun 30 '11 at 16:32
0

I gave it a quick look. Couldn't track the app flow, but what seems strange is the

c = !c;

line of code. Why dont you just set it to true, or directly return true, if you meet the conditions the first time? I'm assuming, that chrome goes to "true" and then inverts it the next time its within the x/y bounds.

I'm not familiar with Raphael or SVG, but it seems your polygons are squares, thus you could do a simple within test

//original found here http://www.gamedev.net/topic/483716-point-inside-of-rectangle/
function inside( x, y, l, r, b, t ){ //x,y are the point, l,r,b,t are the extents of the rectangle
    return x > l && x < r && y > b && y < t;
}
japrescott
  • 4,736
  • 3
  • 25
  • 37
  • 2
    The polygon islands are not squares (the tiles are squares, but that's not what I'm doing the hit test on).The "c = !c" simply switches c from true to false or vice-versa, as part of the intersection test. The intersection test works by checking whether an imaginary line intersects the polygon's perimeter an odd or even number of times, which is how the script determines if the point is inside the polygon. It's a neat script, but I didn't write it. – shipshape Jun 30 '11 at 02:22