Open Friksel opened 2 years ago
Try changing viewport#options.divWheel = DOM element when initializing the viewport.
Try changing viewport#options.divWheel = DOM element when initializing the viewport.
Unfortunately that doesn't help as we're talking about multiple DOM elements on top of the pixi canvas. The only thing I'm looking for really is how to simulate the action pixi-viewport takes when a wheel event is received. Isn't there a method we can call to simulate a wheel event?
@davidfig Just tried your suggestion by adding a wrapper around both the canvas and the DOM elements and using the divWheel
option to capture the wheel event from that wrapper div.
However, setting the divWheel
in the option doesn't seem to work.
When diving deeper I see the events reachting the wrapper div just fine; they're triggered when using the wheel on either the canvas or one of the DOM elements. So I would expect this to be triggering the wheel action on pixi-viewport too. But it doesn't do that. So it looks like the divWheel
option is not working somehow.
Alright, I am in your code now and see that the event IS working on the wrapper div, IS sending the event to pixi-viewport, IS calling the handleWheel()
event of the pixi-viewport
, but it's breaking out of that function because the interactionDOMElement is not the same as the event.target. Meaning this will probably never execute the wheel action on the viewport when triggered by a DOM element over the viewport IMO:
Using a
pixi-viewport
with DOM elements above that canvas I'm looking for a way to pass the wheel event from the DOM elements to thepixi-viewport
's wheel-'plugin' so that the mousewheel works on the viewport instead of on the DOM elements.I tried several things, but so far can't manage to get it to work. I have the eventlistener for the DOM elements' wheels, but how can we trigger the
wheel()
action on thepixi-viewport
?BTW Setting
pointer-events
on the DOM elements tonone
to make them pass the events directly to the viewport doesn't do the trick because we need the other pointer events, like clicks, to still work on these elements.