Three.js: Mapas de sombras: proyección de sombras en un plano transparente

Creado en 23 abr. 2012  ·  28Comentarios  ·  Fuente: mrdoob/three.js

Hola,

Necesito proyectar sombras en un plano transparente para obtener solo la sombra que se muestra y no el material aplicado al plano (lo quiero completamente transparente). ¿Es esto posible en three.js? Estoy usando THREE.SpotLight como fuente de luz.

Como solución alternativa, creo que podría aplicar un mapa de textura completamente transparente como material y ver si funciona como se esperaba, pero me preguntaba si podría lograr este efecto simplemente modificando las propiedades estándar del material.

Gracias

Question

Comentario más útil

A partir de r77 ShadowMaterial ahora está en el núcleo.

Todos 28 comentarios

OK, la solución alternativa no funcionó ya que no puedo obtener ninguna sombra proyectada en un plano mapeado de textura transparente ...

No creo que eso sea posible.

No estoy seguro de entender la pregunta, pero las sombras deben proyectarse sobre materiales transparentes.

Lo que no debería funcionar es la luz que brilla a través de los materiales transparentes. Es decir, todo es completamente opaco o completamente transparente para las sombras, no hay nada intermedio, independientemente de la transparencia del material.

Vea también la discusión en el n. ° 1509

Lo que no debería funcionar es la luz que brilla a través de los materiales transparentes. Es decir, todo es completamente opaco o completamente transparente para las sombras, no hay nada intermedio, independientemente de la transparencia del material.

Sí, creo que eso es lo que quiere decir.

Como referencia, si alguien lo necesita http://pastie.org/5088640

@skrat Un millón de gracias por ese sombreador. ¡Funciona perfectamente para un cazador de sombras!

@etx uh, ¿qué hace ese sombreador? : U

Simplemente me da la sombra con alfa y el resto del objeto con ese sombreador es invisible. Es similar a un cazador de sombras en el software CGI. Estoy usando threejs para renderizar un producto sobre una fotografía, así que esto es muy útil.

Correcto. Por lo que le da una textura negra con la visibilidad almacenada en el canal alfa. ¿Correcto?

¡Sí!

@etx ¿Cómo puedes lograr esto usando el sombreador de arriba? lo que obtengo es solo un avión negro ...

He estado buscando una forma de obtener su efecto, sin embargo, al usar el fragmento de arriba, obtengo THREE.WebGLShader: Shader couldn't compile. error

@skrat, ¿hay alguna posibilidad de que puedas volver a cargar ese sombreador? el enlace pastie ya no funciona y he encontrado exactamente el mismo problema ... ¡gracias de antemano!

@etx @skrat, ¿ podría @JosephClay ,

Prueba THREE.ShadowMaterial() . Vea esta publicación de stackoverflow.

@WestLangley , ¿crees que deberíamos promover ShadowMaterial al núcleo?

@WestLangley muchas gracias, eso lo resolvió. @mrdoob Creo que es una función muy útil que muchos conocen de GCI, por lo que podría ser una buena promoción para el núcleo

@WestLangley , ¿crees que deberíamos promover ShadowMaterial al núcleo?

No tengo un sentimiento fuerte de una manera u otra ... Si no me equivoco, sufre la misma deficiencia que MeshLambertMaterial - un texel a la sombra de una luz no recibe luz de ninguna otra luz .

Sí, es una máscara. Básicamente como solían ser las viejas sombras.

Hola,

ShadowMaterial suena exactamente como lo que necesito y estoy muy feliz de que lo hayas implementado, pero no puedo averiguar qué versión de three.js necesito descargar / vincular para que funcione. ¿Me puede apuntar en la dirección correcta?

r74 o más reciente

¡Gracias! Todavía obtengo TRES. Sin embargo, ShadowMaterial no es un constructor.

Aún no está incluido en la compilación, está en la carpeta de ejemplos. Debes incluirlo por separado:

<script src="js/materials/ShadowMaterial.js"></script>

lo promovería al núcleo también, es 4kb

¡Perfecto, gracias! Busqué el archivo shadowMaterial antes y no pude encontrarlo.
Funciona fantásticamente para mis necesidades.

A partir de r77 ShadowMaterial ahora está en el núcleo.

@mrdoob gran movimiento gracias

Prueba THREE.ShadowMaterial() . Vea esta publicación de stackoverflow.

Gracias.
¡Funciona!

¿Fue útil esta página
0 / 5 - 0 calificaciones