Estoy empezando a aprender three.js, lo estoy haciendo en codepen.io. El problema es que trato de agregar una textura a mi boxgeometry y no aparece, ¿cuál es el problema con mi código?
const cubetexture = new THREE.TextureLoader().load('https://i.stack.imgur.com/9vixO.png'); const geometry = new THREE.BoxGeometry( 10, 10, 10 ) const material = new THREE.MeshBasicMaterial( { map: cubetexture } ); const cube = new THREE.Mesh( geometry, material ); cube.rotateY(Math.PI / 3); scene.add(cube)Su imagen está siendo bloqueada porque Imgur no especifica una política CORS . Por razones de seguridad, los navegadores modernos se negarán a cargar la imagen, como se evidencia en la consola del desarrollador:
En este caso, la solución más sencilla sería volver a cargar su imagen en Imgur a través del sitio principal y usar la URL desde allí. i.stack.imgur.com (imágenes cargadas a través de Stackoverflow) no envía los encabezados CORS requeridos, pero i.imgur.com (imágenes cargadas a través del sitio principal ) sí.