Question

当我尝试执行此example时，我发现它在当前sample上可以正常工作，但是当我尝试放置包含连续2D帧的二进制文件时，从{{ 3}}我没有这样的详细图像：

这是转换器二进制代码：

<?php
header("Content-type: application/octet-stream");
header('Content-disposition: attachment; filename=head256x256x1092.bin');

$dirs = scandir('512');
unset($dirs[0]);
unset($dirs[1]);
natsort($dirs);
foreach($dirs as $dir):
$fp = fopen('512/'.$dir, "r");
while (!feof($fp))
{
    echo fread($fp, 65536);
    flush(); // this is essential for large downloads
}
fclose($fp);

endforeach;
?>
~

这是threejs文件阅读器：

new THREE.FileLoader()
      .setResponseType( 'arraybuffer' )
      .load( 'head256x256x1092.zip', function ( data ) {

        var zip = new JSZip( data );
        var array = zip.files[ 'head256x256x1092.bin' ].asUint8Array();

        var texture = new THREE.DataTexture2DArray( array, 256, 256, 109 );
        texture.format = THREE.RedFormat;
        texture.type = THREE.UnsignedByteType;
        texture.needsUpdate = true;
        var material = new THREE.ShaderMaterial( {
          uniforms: {
            diffuse: { value: texture },
            depth: { value: 0 },
            size: { value: new THREE.Vector2( planeWidth, planeHeight ) }
          },
          vertexShader: document.getElementById( 'vs' ).textContent.trim(),
          fragmentShader: document.getElementById( 'fs' ).textContent.trim()
        } );
        var geometry = new THREE.PlaneBufferGeometry( planeWidth, planeHeight );
        mesh = new THREE.Mesh( geometry, material );
        scene.add( mesh );
      } );

Answer 1

DataTexture是rgb的数组 jpeg文件是压缩数据，不一样。您可以使用此功能：

function jpegToBinaryData( $filename ) {
  $data = '';
  $img = imagecreatefromjpeg( $filename );
  for( $y = 0; $y < imagesy( $img ); $y++ ) {
    for( $x = 0; $x < imagesx( $img ); $x++ ) {
        $rgb = imagecolorat( $img, $x, $y );
        $r = ( $rgb >> 16 ) & 0xFF;
        $g = ( $rgb >> 8 ) & 0xFF;
        $b = $rgb & 0xFF;
        $data .= chr( $r ) . chr( $g ) . chr( $b );
    }
  }
  return $data;
}

读取原始图像数据时，Threejs 2D纹理数组问题

1 个答案: