Jump to content

How to test if a point is in a Graphics rectangle object? How about a rotating and moving rectangle?


Recommended Posts

To start, lets create a Graphics object.


const clip = new PIXI.Graphics();
clip.beginFill(0xAAAAAB, 0.3);
clip.drawRect(0, 0, 80, 60);

There are getBounds() method and getLocalBounds() method in the PIXI.Graphics class. I guess one of these two methods are used to get a Rectangle bounds from the Graphics object. But which one? Is it getLocalBounds()? I find this one to be the nearest answer. So now we can use the `contains` method of PIXI.Rectangle to test if a point is in that rectangle.

What if my rectangle rotates to a certain angle? like:

clip.rotation = randomFloat(-Math.PI, Math.PI);

randomFloat(min, max) {
    return min + Math.random() * (max - min);

Does my rectangle's getLocalBounds returns the correct bounds that rotates a angle? Say I want to build something like a radar that can scan dots around it. I use a very long rectangle and its pivot point is in one end and the other end just spin around the pivot point. Does the rotating rectangle's clip.getLocalBounds().contains(x, y) detect the scanned dots as it rotates? One step further, if my Graphics object also moves with a camera, which means the pivot point and the starting (x,y) of the rectangle changes all the time, I can still use this method right?

Link to comment
Share on other sites

2 hours ago, xerver said:

You can just usethe `containsPoint` method of Graphics.

Thank you. I didn't know this method exists! 

But I am still unable to test containing a point correctly. Would you mind having a look into my code? I thought drawing the graphics out as a sprite looks clearer and easier to manipulate.

In the code, whenever the clip_sprite finds a point that is contained in it the contained sprite will change its color to darker. But the rectangle seems to stick to a tiny area somewhere on the top left corner of my map, at about (300, 200) instead of following my player. But I wonder why, because when I draw the rectangle sprite out its position changes with the player.


Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...