ajax - 通过 ajax 加载二进制 WebGL 模型的最佳方法?

标签 ajax webgl

我一直在使用 WebGL 开发基于网络的 3D 应用程序。 在服务器端生成二进制 3D 模型,客户端使用 AJAX 下载该模型。模型可能非常大(> 200K),因此我想避免以文本格式发送它们。目前我使用以下代码来实现这一点:

stream = http.responseText; // results of ajax request
..... 
var len = stream.length;
var header_size = 4 + 4 + 4*2; 
var buf_sz = len + 16;
var buf = new ArrayBuffer(buf_sz);
var bytes = new Uint8Array(buf, 0, buf_sz);

for(i = 0; i < len; i++) {
    bytes[i] = stream.charCodeAt(i) & 0xff;
}
....    
// use these to initialize WebGL buffers
var verts = new Float32Array(buf, bytes_skip, n_verts*3);
var normals = new Float32Array(buf, bytes_skip + n_verts*12, n_verts*3);
var indices = new Uint16Array(buf, bytes_skip + n_verts*24, n_indices);
... 

而在服务器端,我使用“charset=x-user-defined”发送数据

换句话说,我基本上必须逐个字符地从“流”中复制数据来初始化数组缓冲区。我想知道是否有更好(更直接)的方法来做到这一点?也许直接从流中实例化 arraybuffer?..

附言。我知道还有 jDataView 库,但它基本上做同样的事情

最佳答案

执行类似下面代码片段的操作以将数据作为二进制数组获取(来自 https://developer.mozilla.org/en/DOM/XMLHttpRequest/Using_XMLHttpRequest 的代码示例):

var xhr = new XMLHttpRequest();  
xhr.open("GET", url, true);  
xhr.responseType = "arraybuffer";   
xhr.onload = function(e) {  
  var arraybuffer = xhr.response; // not responseText  
  /* ... */  
}  
xhr.send();

关于ajax - 通过 ajax 加载二进制 WebGL 模型的最佳方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11752456/

相关文章:

jquery - Ajax : empty json response when using Karma

php - FullCalendar JSON Feed 不起作用 : my calendar doesn't put the data from the JSON feed onto my webpage

node.js - Electron 中有问题的webGL支持

webgl - 如何修改此 WebGL 片段着色器以增加高光的亮度并减少

c# - 在没有浏览器发出弹出警告的情况下打开新窗口

jquery - 使用 JQUERY 的正确 AJAX GET 结构

javascript - OpenTok Api 广播视频在网页中的位置

javascript - cytoscape.js webgl 渲染器

opengl-es - 在 WebGL 中使用 gl_FragDepth

webgl - 如何快速学习 WebGL?