Javascript Three.JS错误-纹理不是两个/Can'；不要改变纹理

快速运行-我正在尝试构建一个360图像的库，当单击库图像时，会打开内置360 viewer的模式，但我希望图像根据已单击的库图像动态更改

THREE.WebGLRenderer: image is not power of two (1920x960). Resized to 2048x1024 
blob:http://nolan.bfdevserver.com/7ca91892-2e3b-4fff-b672-ec250ef13498 new image blob
blob:http://nolan.bfdevserver.com/7788013c-9611-497a-bc12-66a06bb2244f old image blob
THREE.WebGLRenderer: image is not power of two (0x0). Resized to 0x0 
THREE.WebGLRenderer: Texture is not power of two. Texture.minFilter should be set to THREE.NearestFilter or THREE.LinearFilter. 
THREE.Texture
WebGL: INVALID_VALUE: texImage2D: no canvas

material.minFilter = THREE.LinearFilter;

这是我在控制台中收到的错误。正如您在下面的代码中所看到的：

material.minFilter = THREE.LinearFilter;

所以我不知道为什么会这样

material.minFilter = THREE.LinearFilter;

   <div id="container" data="<?php $ThreeSixtyImage = the_field('image'); ?>"></div>

<div id="gallery-modal" class="modal">
</div> 

<div id="gallery" class="gallery">
    <div class="gallery-item">
        <img src="https://www.bluefire360.com/wp-content/uploads/V4260450-min.jpg" />
    </div>
    <div class="gallery-item">
        <img src="http://nolan.bfdevserver.com/wp-content/uploads/pano_2048.jpg" />
    </div>
    <div class="gallery-item">
        <img src="http://nolan.bfdevserver.com/wp-content/uploads/pano_2048.jpg" />
    </div>
</div>

        <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r79/three.min.js"></script>

---

要修复两个错误的幂，需要更改此行：

material.minFilter = THREE.LinearFilter;

material.minFilter = THREE.LinearFilter;

到

material.minFilter = THREE.LinearFilter;

要更新纹理，请返回标准图像url与blob url，并使用：

material.minFilter = THREE.LinearFilter;

if(newestImage) {
   material.map = new THREE.TextureLoader().load(newestImage);
}

这是一个有效的代码笔，我似乎无法在代码段编辑器中使用它。