Three.js LuminanceFormat UnsignedShort的DataTexture不可渲染_Three.js

Three.js LuminanceFormat UnsignedShort的DataTexture不可渲染

three.js

Three.js LuminanceFormat UnsignedShort的DataTexture不可渲染,three.js,Three.js,我有一个关于uint16数据的GL_亮度的小问题。我想把一些OpenGL代码带到WebGL/three.js： glTexImage2D(GL_TEXTURE_2D, 0, myColor, (ushort)width, (ushort)height, 0, GL_LUMINANCE, GL_UNSIGNED_SHORT, imageData); 当运行这个基本的示例代码时，我得到了一个错误 texture bound to texture unit 0 is no

我有一个关于uint16数据的GL_亮度的小问题。我想把一些OpenGL代码带到WebGL/three.js：

glTexImage2D(GL_TEXTURE_2D, 0, myColor, (ushort)width, 
             (ushort)height, 0, GL_LUMINANCE, GL_UNSIGNED_SHORT, imageData);

当运行这个基本的示例代码时，我得到了一个错误

texture bound to texture unit 0 is not renderable. 
It maybe non-power-of-2 and have incompatible texture filtering.

我不是专家，所以也许这根本不起作用？这就是基本示例：

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Pragma" content="no-cache"> 
    <meta http-equiv="Expires" content="-1">

    <script type="text/javascript" src="js/three.js"></script>    
  </head>
  <body>
      <canvas id="c" width="800" height="800" style="border:1px solid">No canvas functionality</canvas>
      <script>
          var canvas = document.getElementById("c");
          var scene = new THREE.Scene();
          var camera = new THREE.PerspectiveCamera(75, canvas.width / canvas.height, 0.1, 1000);
          var renderer = new THREE.WebGLRenderer( { canvas: canvas } );

          var test = new Uint16Array(2048 * 2048);
          for(var i = 0; i < test.length; i++) {
              test[i] = Math.floor((Math.random() * 0xFFFF) + 1);
          }

          var geometry = new THREE.PlaneGeometry(1, 1);
          var tex = new THREE.DataTexture(test, 2048, 2048, THREE.LuminanceFormat, THREE.UnsignedShortType);
          var material = new THREE.MeshBasicMaterial( { map: tex } );
          var mesh = new THREE.Mesh(geometry, this.material);
          material.map.needsUpdate = true;
          scene.add(mesh);

          var bbox = new THREE.BoundingBoxHelper( mesh, 0xFF0000 );
          bbox.update();
          scene.add( bbox );

          camera.position.z = 1;

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

          requestAnimationFrame(render);
      </script>
  </body>
</html>


没有画布功能
var canvas=document.getElementById（“c”）；
var scene=new THREE.scene（）；
var摄像机=新的三视角摄像机（75，canvas.width/canvas.height，0.11000）；
var renderer=new THREE.WebGLRenderer（{canvas:canvas}）；
var测试=新的UINT16阵列（2048*2048）；
对于（变量i=0；i


提前感谢
在网上挖掘之后，我发现了这个论坛条目：

对于纹理，没有gl.SHORT或gl.UNSIGNED_这样的缩写
在OpenGL ES 2.0或WebGL中
从OpenGL ES 2.0规范来看，这些是唯一支持的格式
RGBA UNSIGNED_BYTE  
RGB UNSIGNED_BYTE  
RGBA UNSIGNED_SHORT_4_4_4_4
RGBA UNSIGNED_SHORT_5_5_5_1  
RGB UNSIGNED_SHORT_5_6_5  
LUMINANCE_ALPHA UNSIGNED_BYTE  
LUMINANCE UNSIGNED_BYTE  
ALPHA UNSIGNED_BYTE

OES_纹理_浮动添加
RGBA FLOAT 
RGB FLOAT 
LUMINANCE_ALPHA FLOAT 
LUMINANCE FLOAT 
ALPHA FLOAT

这就为我解决了：）
不是答案，但您的示例使用的是THREE.LuminanceFormat
、Uint8Array
和THREE.UnsignedByteType
。检查WebGL规范的限制。那么您是如何呈现uint16数据的呢？：）