1

在过去的三天里，我试图用我知道的各种关键字来寻找答案，但没能走得更远。我是 JavaScript/WebGL 的新手，所以这可能是我完全的无知，如果是这样，请原谅我。

这就是我从服务器下载二进制文件（自定义图像文件格式）并从下载的数据中读取前四个字节（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

以下是使用普通 ol' XHR 的方法：http: //www.html5rocks.com/en/tutorials/file/xhr2/#toc-reponseTypeArrayBuffer

您需要将 xhr 对象的 responseType 属性设置为“arraybuffer”。

如果您的图像数据是未压缩的 RGBA，它应该可以在 WebGL 中按原样使用。如果是压缩的，则需要先将其放入图像中。请参阅 Blob API，了解如何创建对象 URL 并将其用作图像 src。

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 回答