processing / processing/p5.js

A way to position lights with transforms (maybe a variant of worldToScreen?)

Open
#7,889 9 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

Area:WebGL Enhancement
Dominant language
JavaScript
Stars
24k
Forks
3.8k
Avg merge
3d 16h
Merged PRs (30d)
25

Description

Increasing access

While working on this sketch https://openprocessing.org/sketch/2670771 I was positioning an exit sign that I also wanted to cast light. I was positioning the sign model using translations and rotations. Getting the light to go in the same spot was going to be tough because functions like pointLight don't take those into account, and requires matrix math. This is likely not something everyone is comfortable with, and may result in them not trying to use lights in their scene otherwise.

Most appropriate sub-area of p5.js?
  • Accessibility
  • Color
  • Core/Environment/Rendering
  • Data
  • DOM
  • Events
  • Image
  • IO
  • Math
  • Typography
  • Utilities
  • WebGL
  • Build process
  • Unit testing
  • Internationalization
  • Friendly errors
  • Other (specify if possible)
Feature enhancement details

I'm not sure yet what the best way to deal with this is, but, some ideas:

  • Make lights take transformations into account
    • Benefits: probably the most straightforward conceptually
    • Downsides: to not be a breaking change, this would likely have to be optional, and lighting overloads are already quite complex (see the long list for spotLight, for example)
  • Add a way to get world-space coordinates from local coordinates
    • Benefits: we have something similar for screen coordinates with worldToScreen and screenToWorld. This is what I ended up doing in my sketch, defining a similar worldPoint method at the top
    • Downsides:
      • The target space is world space, but I think we maybe named those other methods slightly inaccurately, since they also use "world" but in a less standard definition. They go from a local coordinate to a screen coordinate. In shader hooks, we use the terms object space, world space, and camera space. Based on those, it would more accurately be objectToScreen. Not sure how to navigate that naming just yet, open to suggestions!
      • It requires some more steps to use it -- you have to first grab the world coordinate given the current transforms, and then pass it into a lighting function

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing the WebGL lighting entry points mentioned in the issue, especially pointLight and spotLight, alongside worldToScreen and screenToWorld. Compare the two proposed approaches and clarify the object-space, world-space, and screen-space naming. Done means the project has an agreed API direction and defined behavior for positioning lights with transformed objects.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
computer-graphics
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.