I updated a-frame version to 1.5.0 but I have an issue with env maps.
https://glitch.com/~better-incongruous-trollius
<html>
<head>
<script src="https://aframe.io/releases/1.5.0/aframe.min.js"></script>
</head>
<body>
<a-scene id="myscene" light="defaultLightsEnabled: false">
<a-assets>
<a-cubemap id="worldenvmap">
<img crossorigin="anonymous" src="https://cdn.glitch.global/93cb2d31-d256-4fcb-8b8e-db12192ccc88/envYup00.jpg?v=1711444964960">
<img crossorigin="anonymous" src="https://cdn.glitch.global/93cb2d31-d256-4fcb-8b8e-db12192ccc88/envYup01.jpg?v=1711444965270">
<img crossorigin="anonymous" src="https://cdn.glitch.global/93cb2d31-d256-4fcb-8b8e-db12192ccc88/envYup02.jpg?v=1711444965584">
<img crossorigin="anonymous" src="https://cdn.glitch.global/93cb2d31-d256-4fcb-8b8e-db12192ccc88/envYup03.jpg?v=1711444966011">
<img crossorigin="anonymous" src="https://cdn.glitch.global/93cb2d31-d256-4fcb-8b8e-db12192ccc88/envYup04.jpg?v=1711444966332">
<img crossorigin="anonymous" src="https://cdn.glitch.global/93cb2d31-d256-4fcb-8b8e-db12192ccc88/envYup05.jpg?v=1711444966628">
</a-cubemap>
<a-asset-item id="sphere" src="https://cdn.glitch.global/93cb2d31-d256-4fcb-8b8e-db12192ccc88/model.obj?v=1711447695860"></a-asset-item>
<a-asset-item id="balls" src="https://cdn.glitch.global/93cb2d31-d256-4fcb-8b8e-db12192ccc88/MetalRoughSpheres-(1)%20(1).glb?v=1711444768035"></a-asset-item>
</a-assets>
<a-obj-model id="spherem" src="#sphere" position="16 -4 -30" scale=".1 .1 .1"></a-obj-model>
<a-entity
id="ballstest"
gltf-model="#balls"
position="0 1 -8" material="envMap:#worldenvmap">
</a-entity>
<a-sky color="#ECECEC"></a-sky>
</a-scene>
</body>
<script>
setenvmap('ballstest');
setenvmap('spherem');
function setenvmap(assetId) {
console.log('### -> ',assetId);
// setTimeOut represents app stage or user interaction
setTimeout(()=>{
let envMapS = document.querySelector('#worldenvmap');
if (envMapS) {
const paths = [];
envMapS.childNodes.forEach(c => { if (c.src) { paths.push(c.src); } });
if (paths.length === 6) {
const loader = new THREE.CubeTextureLoader();
loader.setCrossOrigin('anonymous');
// loader.setCrossOrigin('Access-Control-Allow-Origin');
loader.setPath('');
loader.format = THREE.RGBAFormat; // e.g. THREE.RGBFormat
this.cubeTex = loader;
this.texture = loader.load(paths);
} else {
console.error(`Invalid environment map on element '${el}'`)
}
}
let thisel = document.getElementById(assetId);
const mesh = thisel.getObject3D('mesh');
const envMap = this.texture;
envMap.encoding = THREE.sRGBEncoding;
if (mesh) {
mesh.traverse(function(node) {
if (node.material && 'envMap' in node.material) {
node.material.envMap = envMap;
node.material.needsUpdate = true;
}
});
}
}, 4444)
}
</script>
</html>
in codes, scene has no lights also defaultLightsEnabled: false
All objects are black(no light) before applying envMap. After applying envMap to objects, they are acting like there are lights in the scene. This doesn't happen with A-frame 1.3.0, 1.4.0 and 1.4.2
Am I missing something with a-frame 1.5.0?