Comments (13)
Can confirm. This example using envMap
- is broken with
MeshStandardMaterial
: https://jsfiddle.net/7hdo4bsj/1/ - works with
MeshPhongMaterial
: https://jsfiddle.net/7hdo4bsj/2/
from three.js.
Works like a charm; Thanks for the quick response!
from three.js.
It should work on your Quest if you open in a new tab that uses SSL: https://fgcmdc.csb.app/
from three.js.
Thanks for the quick reply. Yes, I'm still seeing the distortion with that version loaded: https://yvqwqv.csb.app/
Here's the sandbox link if you want to check it over: https://codesandbox.io/p/sandbox/pmrem-threejs-forked-yvqwqv
from three.js.
@drbct Can you please replace all materials in your scene from MeshStandardMaterial
to MeshPhongMaterial
and test again? Scene.environment
can't be used in this context so you have to assign the environment map to the envMap
property instead. But since you said using envMap
produces the same (wrong) result, it should be good for a test.
I want to clarify if PMREMGenerator
breaks in XR. In might be necessary to disable XR in PMREMGenerator
during the generation process. The generator is not used with MeshPhongMaterial
.
from three.js.
Can you test with one of the build files of Mugen87@d2b06ee if the issue is fixed?
I've added a patch to PMREMGenerator
that hopefully fixes its usage in XR.
from three.js.
Apologies if I'm misunderstanding this fix, but I'm not able to get the THREE.CubeCamera to update properly while using WebXR, and it seems to be related to the pmremVersion.
Here's a sandbox: https://codesandbox.io/p/sandbox/pmrem-threejs-fgcmdc
It's a slightly modified version of the official dynamic cube reflection example.
I've added a VR button. It renders fine on desktop. In my Meta Quest 2, it renders, but the perspective is warped and unusable.
The problem can be fixed by commenting out the MeshStandardMaterial in line 49 and uncommenting the MeshBasicMaterial in line 55, and then uncommenting line 113:
cubeCamera.renderTarget.texture.pmremVersion--;
With that, it renders fine on the Meta Quest, seemingly because the PMREM update is bypassed.
Is anyone else experiencing this? Or is using the cubeCamera to generate a dynamic envMap not supported yet in WebXR?
from three.js.
I can't test fiddles and codesanbox apps with a Quest since VR is not allowed inside their iFrames.
Any chances to share a standalone test application that demonstrates the issue?
@drbct Do you see any regressions in r163
with your XR apps compared to the dev
version we have tested with? Is the original issue of this thread still solved with the current release?
from three.js.
Thanks! Indeed, I can confirm the perspective is completely broken.
Would it possible for you to make a test with this version of the build file? Does the bug disappear?
from three.js.
Okay, so it seems it isn't a regression within r163
. I need a closer look for this one...
from three.js.
I can't edit the sandbox so I can't share a new link. But I suggest you remove the lines:
sphere.position.z -= 75;
cube.position.z -= 75;
torus.position.z -= 75;
You then have to move the camera away from the origin:
camera.position.z = 75;
The cube camera should be position at the location of the sphere like so:
cubeCamera.position.copy( sphere.position );
I was wondering why OrbitControls
is broken in your app and the root cause is positioning the camera at the origin. I believe the side effects we see in XR could be related to the same issue.
Besides, a XR scene should honor real world scale so it's better to position the like so:
camera.position.set( 0, 1.75, 2 );
This requires a different transformation of the sphere, torus and box as well.
from three.js.
If the issue still persists, please file a new issue. The issue we see is unrelated to the problem originally discussed here.
from three.js.
OK - thanks for helping. I'll investigate further.
from three.js.
Related Issues (20)
- TSL: Missing While Support
- Please allow full testing on components by running CI/CD tests in real DOM environment and support loading assets from disk
- rotate-to-cursor on touch events HOT 1
- VolumeNodeMaterial only renders 1x1x1 HOT 2
- normal z-buffer #webgl_camera_logarithmicdepthbuffer rendering issues cross OS, gpu, browser HOT 3
- Uncaught (in promise) ReferenceError: Request is not defined HOT 2
- TSL: Unusual right associativeness of `sub` and `div`
- what happened? How can I solve this problem? HOT 1
- TSL: Some names for a TSL function break the syntax of translated WGSL or GLSL code
- Editor: Shadow properties in OBJECT tab do not refresh UI when UNDO/REDO
- Editor: Geometry parameters in GEOMETRY tab do not get refresh when UNDO/REDO
- Inconsistent layout in `aomap_fragment` include, compared to i.e. `roughnessmap_fragment` HOT 3
- WebGPU: WebGPURenderer throws a DOMException error on a non-WebGPU browser HOT 2
- Docs: Please updates "WebGL compatibility check" page
- USDZLoader: TypeError: target is undefined HOT 2
- Improve GPUComputationRenderer performance by using fullscreen triangle HOT 3
- WebGPURenderer: Weird DirectionalLight Behavior Between WebGLRenderer and WebGPU Renderer HOT 3
- NodeMaterial: Alpha channel behaves wrong on non-transparent materials HOT 1
- `GLTFExporter` <> `GLTFLoader` round trip `TypeError: Cannot set properties of undefined (setting 'isBone')` HOT 2
- WebGLRenderTarget Texture breaks glTF export HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from three.js.