javascript - three.js - 纹理未加载

Question

语境

我正在尝试重新创建显示的示例 here使用 jsfiddle .我正在使用这段代码来加载纹理数组:

        var r = "https://github.com/timoxley/threejs/tree/master/examples/textures/cube/Park3Med/";
        var urls = [
            r + "px.jpg", r + "nx.jpg",
            r + "py.jpg", r + "ny.jpg",
            r + "pz.jpg", r + "nz.jpg"
        ];

我只是想重新创建纹理，而不是层。有什么原因导致它无法像我设置的那样工作吗？

Answer 1

接受的答案在陈述错误方面是正确的，但遗漏了一个简单的解决方案。您可以使用 Three.js 加载跨源图像数据。你只需要正确设置它。这是修复的示例:https://jsfiddle.net/1dy343xy/

代码更改:

    var loader = new THREE.CubeTextureLoader();

    loader.setCrossOrigin( 'anonymous' );

    var textureCube = loader.load( urls );

另请注意，您指向的是错误的网址。你需要为你正在做的事情使用 git raw urls，虽然我不知道它是否符合 git ToS。