Jump to content

Send events to objects underneath topmost interactive obj?


Recommended Posts



Brand new to Pixi.js and JS development in general. I have a quick question regarding InteractionManager. I have two objects on the stage: a box with a scroll listener for mousewheel events and multiple boxes "underneath" with pointertap listeners. Is there a way to capture these scroll events and the pointertap events on the objects underneath? The current behavior is.. the scroll events are fired, but because that scroll box is interactive and above the click boxes, the pointertap events are not fired. Any thoughts?


Thanks in advance!

Link to comment
Share on other sites

hum he maybe create the event like this.

        mask.interactive = true;
        mask.on('pointerdown'    , this.pointerdown_mask    , this);
        mask.on('pointerup'      , this.pointerup_mask      , this);
        mask.on('mouseupoutside' , this.mouseupoutside_mask , this);
        mask.on('mousewheel'     , this.mousewheel_mask     , this);

than you can via listener make a hittest to emmit the scroll event.

        document.addEventListener('wheel',(e) => {
            // authorize zoom only when is inside canvas
            if (e.path.contains($app.renderer.view)) {
                const hitTest = $mouse.interaction.hitTest($mouse.position);
                // Dispatch scroll event
                if (hitTest) { 
                    hitTest._events.mousewheel && hitTest.emit('mousewheel',e,hitTest) || $camera.onMouseWheel.call($camera,e);

But you should share code to understand what is your issue. [pixiplayground or codepen ]

but from what am understand , no is not possible, because the events alway look for sprite order.
So if you have a big sprite in your screen + interactive . All  interactive sprite under will no emit.

you can do a custom hittest maybe ?? 

Or think you will need a kind of z-index for the events.. maybe.
On my side i alway setup my stuff to avoid this issue.



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