question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Can't handle pointer events with a non-default camera

See original GitHub issue

I’m still trying to grasp all of the different hooks in this package so maybe this is a misunderstanding rather than a technical limitation, but here’s the overview:

I have a custom orthographic camera. The default one (or setting it as the default) doesn’t suit my needs because I can’t seem to get a hook that executes after the defaults are applied in order to override the frustum. I understand that not using the default camera means that I can’t rely on the default raycaster and therefore intersection handling code. Before switching to react-three-fiber I had implemented my own handlers for this so it’s not too much trouble.

Unfortunately, I can’t apply them because I would need to attach handlers for these DOM events outside of the Canvas component while also referencing the camera which is inside Canvas (to make use of useThree).

Is there something I’m missing? The Canvas props let me pass arguments to the raycaster but they would just get overridden using the default camera when handling an event.

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:10 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
CodyJasonBennettcommented, Nov 5, 2022

This would currently exist as camera.manual<Canvas camera={{ manual: true }} /> or writing to the manual property of an external camera instance.

1reaction
drcmdacommented, May 30, 2019

added a new flag: Canvas.updateDefaultCamera (true by default). if you switch this off it won’t adjust the camera on size changes.

Read more comments on GitHub >

github_iconTop Results From Across the Web

pointer-events - CSS: Cascading Style Sheets - MDN Web Docs
The pointer-events CSS property sets under what circumstances (if any) a particular graphic element can become the target of pointer events.
Read more >
Safari Technology Preview Release Notes - Apple Developer
Fixed selecting timeline records from a coalesced record bar selecting the first record in the group, not the record nearest the cursor. (254056@main)....
Read more >
Android Interface Definition Language (AIDL)
On Android, one process cannot normally access the memory of another process. ... Declare any non-default types here with import statements ...
Read more >
victor v5.7.1 Administration Guide - American Dynamics
victor Unified Client extends Event Management support to various third party fire and ... the ROI by clicking and dragging the cursor over...
Read more >
react-three-fiber - npm
A default orthographic camera if Canvas.orthographic is true: near: 0.1, ... We support pointer events (you need to polyfill them yourself), ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found