Chrome54 threejs image problem

Chrome54 threejs image problem

by liyuanqiu

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/three.js/r73/three.min.js"></script>
<script src="//139.196.28.110/OrbitControls.js"></script>

JavaScript

init();

function init() {

    var scene = new THREE.Scene();

    var camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
    camera.position.z = 5000;
    scene.add(camera);

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

    new THREE.OrbitControls(camera, renderer.domElement);

    var axis = new THREE.AxisHelper(1000);
    scene.add(axis);

    animate(renderer);

    document.body.appendChild(renderer.domElement);

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

    THREE.ImageUtils.crossOrigin = '';
    var texture = THREE.ImageUtils.loadTexture('http://139.196.28.110/test.jpg');
    var geometry = new THREE.PlaneGeometry(6736, 2575);
    var material = new THREE.MeshBasicMaterial({
      map: texture,
      side: THREE.DoubleSide,
      transparent: false
    });
    var mesh = new THREE.Mesh(geometry, material);
    scene.add(mesh);
}