在浏览器中加载浮点图像并将它们用作WebGL中的纹理

Question

我需要在纹理中存储一些（经度= RED，纬度=绿色，时间=蓝色，日= ALPHA）信息，然后在数据viz原型共享的片段中进行一些查询。所有值都归一化[0,1]。

我正在使用java来创建PNG文件但是有一种方法可以创建一个浮动PNG文件并将其加载到浏览器中。

我认为将它们视为二进制文件但我对网络技术还不是很熟悉。我对此感到抱歉。

另一个想法是使用2个通道，这样我将有16位精度。这会让我觉得很复杂，这个原型的截止日期是12月15日。

到目前为止，除了这个之外我还有一切工作，一旦我解决了这个问题就改变了webGL中的纹理格式。

Answer 1

我知道没有支持浮点纹理的浏览器 - ＆gt; WebGL的。 Safari是唯一一个加载我知道的浮点纹理的浏览器，只支持TIFF格式的Safari，但我不相信它会将这些作为浮点数据传递给WebGL。

我知道的唯一方法是让您自己解压缩数据并使用gl.texImage2D(target, level, internalFormat, width, height, 0, format, gl.FLOAT, someFloat32ArrayBufferYouMade)上传

如何填充该数组缓冲区取决于您。你可以编写自己的PNG解压缩程序（我不知道支持PNG的浮点数）。如果我是你，我只是使用未压缩的二进制文件并下载XHR二进制请求只是为了让一些工作正常。然后，您可以在以后进行压缩和解压缩。

使用2个或更多通道获得更高分辨率而不使用浮点纹理的想法也是一种常见的解决方案。

Answer 2

是的，我设法使一切都与XMLHttpRequest一起工作。我以2k乘2k浮点纹理（https://snap.stanford.edu/data/loc-brightkite.html）存储来自Brightkite的4.2milion记录。我想使用数据集中的负值，但我认为规范化的值适用于原型。

我在一篇文章中读到，如果我使用LUMINANCE，我可以存储负值。星期三之后我会检查这个，因为我当天有一个期中考试。

我将文件存储为二进制文件，到目前为止它工作得很好。现在是时候开发查询了。

感谢您的帮助。