three.js:Failed to execute 'texImage2D' on 'WebGLRenderingContext解決方案

three.js加載圖片時，出現Failed to execute 'texImage2D' on 'WebGLRenderingContext .Tainted canvases may not be loaded.的錯誤

跨域安全問題。

解決辦法：

1 若是你用的是紋理題圖：如：

var loader = new THREE.TextureLoader();

加上：

loader.setCrossOrigin( 'Anonymous');

便可。（THREE.ImageUtils.loadTexture也可用這個方法）

 

2 若是你是直接用img的，如：

var img = new image(); 加上 img.crossOrigin =「anonymous」 便可

 

3 若是你被THREE.WebGLRenderer: image is not power of two  這樣的warning所困擾，在你的創建mesh後加上：mesh.material.map.minFilter = THREE.LinearFilter; 便可。如

 var mesh = new THREE.Mesh( geometry, material );

mesh.material.map.minFilter = THREE.LinearFilter;