Question

所以我想在三个中创造一个8球。我有这个设置

var scene = new THREE.Scene();
var width  = window.innerWidth,
    height = window.innerHeight;

var camera = new THREE.PerspectiveCamera( 45, width / height, 0.01, 1000 );
camera.position.z = 1.5;

var renderer = new THREE.WebGLRenderer();
renderer.setClearColor(0xffffff);
renderer.setSize( window.innerWidth, window.innerHeight );

document.body.appendChild( renderer.domElement );

var light = new THREE.DirectionalLight( 0xffffff, 1 );
light.position.set( 5, 3, 5 );
scene.add( light );

var geometry = new THREE.SphereGeometry( 0.5, 32, 32 );
THREE.ImageUtils.crossOrigin = '';
var loader = new THREE.TextureLoader();
loader.crossOrigin = '';
loader.load(
    // resource URL
    'http://i.imgur.com/CkFSjjv.jpg',
    function ( texture ) {
        var material = new THREE.MeshPhongMaterial( {
            map: texture,
          specular: new THREE.Color('grey')
         } );
    var sphere = new THREE.Mesh( geometry, material );
    scene.add( sphere );
    },
    function ( xhr ) {
        console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
    },
    // Function called when download errors
    function ( xhr ) {
        console.log( 'An error happened', xhr );
    }
);

var sphere = new THREE.Mesh( geometry, material );
scene.add( sphere );


function render() {
    requestAnimationFrame( render );
    renderer.render( scene, camera );
}
render();

现在有效：

// ressource url
'http://i.imgur.com/3tU4Vig.jpg'

但是无法显示具有完全相同大小，格式等的图像：

// ressource url
'http://i.imgur.com/CkFSjjv.jpg'

工作img：http://i.imgur.com/3tU4Vig.jpg 不工作：http://i.imgur.com/CkFSjjv.jpg 我究竟做错了什么？

编辑：使用.load打印出错误。拿到： An error happened error { target: <img>, isTrusted: true, currentTarget: <img>, eventPhase: 2, bubbles: false, cancelable: false, defaultPrevented: false, timeStamp: 1466344211566915, originalTarget: <img>, explicitOriginalTarget: <img>, NONE: 0 }

更改的图像不显示

0 个答案: