title: Uncaught Error: THREE.Quaternion: .setFromEuler() now expects a Euler rotation rather than a Vector3 and order
body: <p>I am using ThreeJS/WebGL to demonstrate a rotating planet inside of an iframe. It is working fine except for a warning and an issue:</p>
  
  <pre><code>Warning: THREE.WebGLRenderer: Texture is not power of two. Texture.minFilter should be set to THREE.NearestFilter or THREE.LinearFilter. 
  
  Issue: Uncaught Error: THREE.Quaternion: .setFromEuler() now expects a Euler rotation rather than a Vector3 and order.
  </code></pre>
  
  <p>I have included the following assets into the body of the iframe:</p>
  
  <pre><code>&lt;div id="webgl"&gt;&lt;/div&gt; 
  &lt;script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/three.js/r70/three.js"&gt;&lt;/script&gt; 
  &lt;script type="text/javascript" src="https://cdn.rawgit.com/bubblin/The-Solar-System/master/jupiter/js/detector.js"&gt; 
  &lt;/script&gt; 
  &lt;script type="text/javascript" src="https://cdn.rawgit.com/bubblin/The-Solar-System/master/jupiter/js/trackBallControls.js"&gt; &lt;/script&gt;
  &lt;script type="text/javascript" src="https://cdn.rawgit.com/bubblin/The-Solar-System/master/jupiter/js/xRingGeometry.js"&gt; &lt;/script&gt;
  </code></pre>
  
  <p>As you can see I'm using trackBallControls.js to rotate the sphere based on user input/touch and I have overridden a <code>RingGeometry</code> method to layer the ring_image along the circumference instead of emanating it radially. </p>
  
  <p>Here's my complete code to simulate Jupiter, for example:</p>
  
  <pre><code>(function() {
    var webglEl = document.getElementById('webgl');
    if (!Detector.webgl) {
      Detector.addGetWebGLMessage(webglEl);
      return;
    }
    THREE.ImageUtils.crossOrigin = '';
    var width = window.innerWidth,
      height = window.innerHeight;
    var radius = 0.45,
      segments = 32,
      rotation = 5;
    var scene = new THREE.Scene();
    var camera = new THREE.PerspectiveCamera(45, width / height, 0.01, 1000);
    camera.position.z = 3;
    camera.position.y = 1;
    camera.position.x = -1;
    var renderer = new THREE.WebGLRenderer();
    renderer.setSize(width, height);
    scene.add(new THREE.AmbientLight(0x553333));
    var light = new THREE.DirectionalLight(0xffffff, .5);
    light.position.set(5, 3, 5);
    scene.add(light);
    var sphere = createSphere(radius, segments);
    sphere.rotation.y = rotation;
    scene.add(sphere);
    var rings = createRings(radius, segments);
    rings.rotation.y = rotation;
    scene.add(rings);
    var stars = createStars(90, 64);
    scene.add(stars);
    var controls = new THREE.TrackballControls(camera);
    webglEl.appendChild(renderer.domElement);
    render();
  
    function render() {
      controls.update();
      sphere.rotation.y += 0.08;
      rings.rotation.y += 0.05;
      requestAnimationFrame(render);
      renderer.render(scene, camera);
    }
  
    function createSphere(radius, segments) {
      return new THREE.Mesh(new THREE.SphereGeometry(radius, segments, segments), new THREE.MeshPhongMaterial({
        map: THREE.ImageUtils.loadTexture('https://cdn.rawgit.com/marvindanig/Images/master/jupiter/jupitermap.jpg'),
        bumpScale: 0.05,
        specular: new THREE.Color('#190909')
      }));
    }
  
    function createRings(radius, segments) {
      return new THREE.Mesh(new THREE.XRingGeometry(1.3 * radius, 1.6 * radius, 2 * segments, 5, 0, Math.PI * 2), new THREE.MeshBasicMaterial({
        map: THREE.ImageUtils.loadTexture('https://cdn.rawgit.com/bubblin/The-Solar-System/master/jupiter/images/rings.png'),
        side: THREE.DoubleSide,
        transparent: true,
        opacity: 0.2,
        specular: new THREE.Color('#495909')
      }));
    }
  
    function createStars(radius, segments) {
      return new THREE.Mesh(new THREE.SphereGeometry(radius, segments, segments), new THREE.MeshBasicMaterial({
        map: THREE.ImageUtils.loadTexture('https://cdn.rawgit.com/marvindanig/Images/master/galaxy_starfield.png'),
        side: THREE.BackSide
      }));
    }
  }());
  </code></pre>
  
  <p>It works (See the output <a href="https://bubbl.in/book/the-solar-system-by-marvin-danig/44" rel="nofollow">here</a>), but I get those warnings and an error. The errors and warnings eventually build up, and my app crashes on the iPad/iPhone.</p>
  
  <p>Please help, I am new to ThreeJS. </p>