Jump to content

Mouse Events in Pixi.js v3 or renderTexture filtered in Pixi.js v2.2.9


CUCHO
 Share

Recommended Posts

Hi, I have the following problem. I need to get a RenderTexture that has been filtered. Unfiltered I get the RenderTexture I need, but if I do filter the RenderTexture I get is empty.

 
I read that this was a bug and is fixed in version 3 of PIXI. So I tried using PIXI v3, but I don't know how to use mouse events. As the code below to PIXI v2:
 
STAGE.mousedown = function (event) {   if (event.originalEvent.which === 1) {      this.mousemove = function (event) {         // do something      }   } else if (event.originalEvent.which === 2) {      this.mousemove = function (event) {         // do something      }   }};STAGE.mouseup = function () {   this.mousemove = null;}STAGE.rightdown = function (event) {   this.mousemove = function (event) {       // do something   }}STAGE.rightup = function () {   this.mousemove = null;}

Help please for any of the two cases

 

Link to comment
Share on other sites

Ok, here I have as I need it to work with PIXI v2:

 

http://www.biopacs.com/pixi/pixi_1.html

 

and here what I have with PIXI v3:

 

http://www.biopacs.com/pixi/pixi_2.html

 

STAGE is a PIXI.Container () and I get the following errors:

Uncaught TypeError: Cannot read property 'which' of undefined (when I need the which option)Uncaught TypeError: undefined is not a function (when I need the event.getLocalPosition function)

Also, in PIXI v2 when I call mouse events from a PIXI.Stage (), I can interact with the whole scene, independent of what it contains. But with PIXI v3 using PIXI.Container () the interaction is limited to children size only. Is there any way to have interaction with the whole scene as PIXI v2?

Link to comment
Share on other sites

This is what the interaction manager gives you on an event:

https://github.com/GoodBoyDigital/pixi.js/blob/dev/src/interaction/InteractionManager.js#L61

The `data` property is an InteractionData object:

https://github.com/GoodBoyDigital/pixi.js/blob/dev/src/interaction/InteractionData.js

Which is where the originalEvent is stored. What you are wanting is "event.data.originalEvent.which".

As for whole scene interactions, the container *is* your scene. You can also set its size to whatever you want if you need it to "fill" your space reguardless of children.

Link to comment
Share on other sites

  • 2 weeks later...

As for whole scene interactions, the container *is* your scene. You can also set its size to whatever you want if you need it to "fill" your space reguardless of children.

 

You could give me an example of how. I just have not been able to do.

 

Thanks.

Link to comment
Share on other sites

I encountered similar scenario.


 


In pixi v2 there was a feature to add mouse events to Stage, now with v3 Stage is deprecated and Container should be used. Previously I could just add mousemove/mouseup handlers to Stage (using stage.mousemove, stage.mouseup, etc), now it doesn't seem to be the case. Question is, how to add stage scoped interactions?


 


Whats the approach that needs to be used now to achieve stage level interaction?


Link to comment
Share on other sites

 

Hi, I have the following problem. I need to get a RenderTexture that has been filtered. Unfiltered I get the RenderTexture I need, but if I do filter the RenderTexture I get is empty.

 
I read that this was a bug and is fixed in version 3 of PIXI. So I tried using PIXI v3, but I don't know how to use mouse events. As the code below to PIXI v2:
 
STAGE.mousedown = function (event) {   if (event.originalEvent.which === 1) {      this.mousemove = function (event) {         // do something      }   } else if (event.originalEvent.which === 2) {      this.mousemove = function (event) {         // do something      }   }};STAGE.mouseup = function () {   this.mousemove = null;}STAGE.rightdown = function (event) {   this.mousemove = function (event) {       // do something   }}STAGE.rightup = function () {   this.mousemove = null;}

Help please for any of the two cases

 

change "if (event.originalEvent.which === 1)" to "if (event.data.originalEvent.which === 1)" and I think that should work.

 

function myFunction(e){

 

}

to add a mouse event now (which is how i have managed to do it). "STAGE.on('mousedown',myFunction);".

I hope that helps

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