facebookarchive / react-360

Create amazing 360 and VR content using React
https://facebook.github.io/react-360
Other
8.73k stars 1.23k forks source link

How to use Reflection Sphere in materialParameters with THREE.js #442

Closed AdminDot closed 6 years ago

AdminDot commented 6 years ago

I'm trying to make an image reflection for a Sphere i'm building with ReactVR. i use materialParameters to setup envMap to Map reflection. <Sphere radius={7.5} materialParameters={{ opacity: 1.0, color: 0x888888, envMap: asset('chess-world.jpg'), reflectivity: 0.25, }} widthSegments={200} heightSegments={120} wireframe={false} lit={true} texture={src = asset('chess.jpg')} style={{ transform: [{ translate: [39, 0, -5] },], }} />

jgwinner commented 6 years ago

Is that a valid material parameter? I couldn't find a quick list in the docs, but I'm not sure about it.

In my book I show how to do an actual reflection (ray traced, sort of), as well as mapped reflections, but it's through a Javascript override.

AdminDot commented 6 years ago

in the document of threejs https://threejs.org/docs/#api/materials/MeshBasicMaterial i see parametter .envMap to The environment map. Default is null. you can give me example to mapped reflections. Thanks you.