Jump to content

Most reasonable way to implement Line of Sight


Hyena
 Share

Recommended Posts

I have to implement line of sight (LOS) and it should appear in grayscale as traditionally seen in RTS games (see the top right corner of the attached screenshot).

I don't have previous experience with filters and blending in PixiJS so I may be wrong here, but to me it seems like an overkill to have an offscreen buffer just for the LOS, which I would then somehow blend with the normally rendered screen to make it partially grayscale. It seems intuitive to have an easier way. Something like a brush that partially desaturates the underlying image where ever it is applied to seems like something of great use in this context. However, having tested different blend modes and filters I was unable to get even close. It seemed to me that both the blending and filters only apply to the source image. How would you blend together multiple images though? Any pointers here would be much appreciated. Thanks!

 

warlordsbattlecry_02.jpg

Link to comment
Share on other sites

Its tricky but possible, here a few links for you to review first:

This plugin allows to take background as input, if it was in renderTexture: https://github.com/pixijs/pixi-picture , i think its possible to even take back from main screen with one trick, i didnt try it yet

Big demo with layers and lights: https://codesandbox.io/s/tender-franklin-iycmu

Usually, you make several layers in different renderTextures then combine them using sprite-blendModes, mesh-shaders or filters.

Edited by ivan.popelyshev
Link to comment
Share on other sites

9 minutes ago, ivan.popelyshev said:

Honestly its better for pixijs slack #shaders discussion, i sent you an invite.

Thanks, joined.

After some more research I found this topic, which discusses a problem conceptually very similar to mine:

 

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.

Guest
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.

Loading...
 Share

  • Recently Browsing   0 members

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