I’m just getting into webGL and want to start loading binary data directly into buffers instead of translating JSON into arrayBuffers. I can load the data correctly into a buffer but when I try and set that buffer as current I get this error in Chrome:
Uncaught TypeError: Type error
Here’s a code snippet, the webGL parts are based off Lesson 1:
function onLoad()
{
var canvas = document.getElementById("lesson01-canvas");
initGL(canvas);
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", "cube.bm", true);
xmlhttp.responseType = "arraybuffer";
xmlhttp.onload = function()
{
var buffer = xmlhttp.response;
gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
// Reading Data
var v1 = new Float32Array(buffer);
alert(v[0]); // This works fine.
}
xmlhttp.send();
}
I guess I need a solid example of how to give the result of a binary XMLHttpRequest into an arrayBuffer correctly. This is a Chrome only thing, I know that Firefox has a different way of requesting binary data at the moment.
Arrrg it wouldnt let me edit the orig post but here’s a slight update to the code:
function onLoad()
{
var canvas = document.getElementById("lesson01-canvas");
initGL(canvas);
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", "cube.bm", true);
xmlhttp.responseType = "arraybuffer";
xmlhttp.onload = function()
{
var buffer = xmlhttp.response;
gl.bindBuffer(gl.ARRAY_BUFFER, buffer); // This causes an error
// Reading Data
var v1 = new Float32Array(buffer);
alert(v1[0]); // This works fine.
}
xmlhttp.send();
}
No it’s not a file issue, I can open the file correctly and I’ve tested that the binary data I receive is correct, the problem is getting that binary data into webGL. But thanks for the reply!
I have yet to actually try and render anything but this at least doesn’t generate any JS errors:
function onLoad()
{
var canvas = document.getElementById("lesson01-canvas");
initGL(canvas);
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", "cube.bm", true);
xmlhttp.responseType = "arraybuffer";
xmlhttp.onload = function()
{
var XHR_buffer = xmlhttp.response;
var GL_Buffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, GL_Buffer);
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(XHR_buffer), gl.STATIC_DRAW);
// Reading Data
var v1 = new Float32Array(XHR_buffer);
alert(v1[0]);
}
xmlhttp.send();
}