mrdoob / three.js

JavaScript 3D Library.
https://threejs.org/
MIT License
101.87k stars 35.32k forks source link

PointsMaterial + light support #17618

Open takahirox opened 4 years ago

takahirox commented 4 years ago
Description of the problem

From #10491

Currently PointsMaterial doesn't support lighting. It may be interesting if we do.

Suggested how to implement here https://github.com/mrdoob/three.js/issues/10491#issuecomment-329491923

particle lighting may be computed just by distance from light source (according to intensity, decay, distance parameters of the light sources), it makes sense.

How it'll look like

Three.js version
Browser
OS
Hardware Requirements (graphics card, VR Device, ...)
EliasHasle commented 4 years ago

PointsBasicMaterial and PointsLitMaterial? Hm.

A dream I hadI had a dream once of making a PointsPhongMaterial that would render perfect spheres with Phong shading, but I think that is better to do otherwise, e.g. using quads (or high-res. spheres, duh), given the huge distortions that will occur near a perspective camera, that will require a lot of discards on large points.

Mugen87 commented 4 years ago

I think it's important to discuss the general reasonableness of light support for points and lines. Both have no normal data and thus you can't implement proper lighting equations. Not sure we want to go this route and arouse false expectations...

mrdoob commented 4 years ago

@EliasHasle You should probably used InstancedMesh for your dream 🙂

mrdoob commented 4 years ago

@Mugen87 Considering GLTF may have normals in lines I'd be open minded about this.

mrdoob commented 4 years ago

For points, I think it would make sense to have a material that is affected by light based on whether the particle is "in range" to the light.

A good use case would be a rainy night scene where spotlights affect a cloud a points/raindrops.

Ford-Taurus-2019-red-color-car-in-night-Ford-Taurus-2019-car-in-rain-in-night-wallpaper

EliasHasle commented 4 years ago

@EliasHasle You should probably used InstancedMesh for your dream 🙂

Yes, but that would be too easy. 😉 I like the beauty of the idea of solving perfect spheres in GLSL without a sphere geometry. Update: I have followed my dream here: https://discourse.threejs.org/t/coding-jam-pixel-perfect-spheres-without-high-res-geometry/10154

light based on whether the particle is "in range" to the light.

Yes! And not only that. It could 1. Scale with light intensity according to decay, and 2. Depend on the eye-point-light angle (think light refraction through droplets). Also on normals, if they are defined per point, which could sometimes make sense if the points model small snow/glitter flakes in the air, for instance.

That being said, I think all of this can be accomplished using ShaderMaterial and a lot of hacks with onBeforeRender and ShaderChunks to include the lights... (And more custom shader code.)

LeviPesin commented 1 year ago

Thinking about this issue and https://github.com/mrdoob/three.js/issues/17511... This is a large breaking idea, but -- maybe we can make BasicMaterial, StandardMaterial, PhongMaterial, etc which wouldn't be mesh- or line-dependent but work for any type of object. I think it is rather complicated to try to make this with shader chunks, but I think it's possible using the nodes system...