1

私は過去3日間、私が知っているさまざまなキーワードを使ってこれに対する答えを見つけようとしましたが、遠くまで行くことができませんでした。私はJavaScript/WebGLを初めて使用するので、これは私の側では完全に無知である可能性があります。その場合はご容赦ください。

これは、サーバーからバイナリファイル（カスタムイメージファイル形式）をダウンロードし、ダウンロードしたデータから最初の4バイト（Int32）を読み取るために行うことです。

TileImage.prototype.LoadFromUrl = function (imageUrl) {
    $.get(imageUrl, function (imageData) {
        var buffer = new ArrayBuffer(imageData); // Verified 'imageData' is good.
        var view = new DataView(buffer);         // Create a data view on buffer.
        var dwordValue = view.getInt32(0);       // Read the first four bytes.
        alert("The first Uint32 value is " + dwordValue);
    });
}

ダウンロードされたデータ「imageData」はサーバー上のファイルとして正しいサイズ（imageData.length）であるため、ダウンロードは成功したと思います。

ダウンロードしたファイルを読み込んで、ヘッダー情報を抽出します（WebGL Texture2Dの残りの画像データを表示に使用します）。したがって、問題は次のとおりです。ダウンロードされたカスタム画像（WebGLでテクスチャとして使用するため）を処理する方法はありますか？そうでない場合、あなたの推奨事項は何でしょうか？

4

1 に答える 1

2

単純な古いXHRでそれを行う方法は次のとおりです： http ：//www.html5rocks.com/en/tutorials/file/xhr2/#toc-reponseTypeArrayBuffer

xhrオブジェクトのresponseTypeプロパティを「arraybuffer」に設定する必要があります。

画像データが非圧縮RGBAの場合、WebGLでそのまま使用できるはずです。圧縮されている場合は、最初に画像に配置する必要があります。オブジェクトURLを作成し、それを画像srcとして使用する方法については、BlobAPIを参照してください。

var blob = new BlobBuilder().append(arraybuffer).getBlob();
img.onload = function() { window.URL.revokeObjectURL(this.src); };
img.src = window.URL.createObjectURL(blob);
于 2011-07-19T14:45:28.403 に答える