topical media & game development

talk show tell print

mobile-query-three-plugins-buffergeometry-examples-genericloader0.htm / htm



  <!doctype html><title>Minimal tQuery Page</title>
  <script src="../../../build/tquery-bundle.js"></script>
  <body><script>
          var world        = tQuery.createWorld().boilerplate().start();
          var object	= tQuery.createTorus().addTo(world);
          
          var chunkTypes        = {
                  padding                : 0,
                  vertexIdx        : 1,
                  vertexPos        : 2,
                  vertexUv        : 3,
          };
          
          var url                = "./modelgeneric.bin"
          var xhr                = new XMLHttpRequest();
          xhr.open("GET", url, true);
          xhr.responseType= "arraybuffer"; 
          xhr.onload        = function(e) {
                  var arraybuffer        = xhr.response; // not responseText
                  console.log('loaded', arraybuffer, arraybuffer.byteLength);
  
                  var dataView        = new DataView(arraybuffer);
                  var offset        = 0;
  
                  console.log('dataView', dataView)
          
                  while(true){
                          // skip padding
                          for(; offset < dataView.byteLength && dataView.getUint8(offset) === chunkTypes.padding; offset++ );
                          console.log('offset', offset)
                          // detect the end of dataView
                          if( offset >= dataView.byteLength )        break;
                          // get chunkType
                          var chunkType        = dataView.getUint8(offset);
                          offset++;
                          console.log(chunkType)
                          if( chunkType === chunkTypes.vertexIdx ){
                                  var numItems                = dataView.getUint32(offset, true);
                                  offset                        += 4;
                                  var vertexIdxArray        = new Int16Array(arraybuffer, offset, numItems);
                                  offset                        += numItems * 2;
                                  // TODO handle big endian
                          }else if( chunkType === chunkTypes.vertexPos ){
                                  var numItems                = dataView.getUint32(offset, true);
                                  offset                        += 4;
                                  var vertexPosArray        = new Float32Array(arraybuffer, offset, numItems);
                                  offset                        += numItems * 4;
                                  // TODO handle big endian
                          }else if( chunkType === chunkTypes.vertexUv ){
                                  var numItems                = dataView.getUint32(offset, true);
                                  offset                        += 4;
                                  var vertexUvArray        = new Float32Array(arraybuffer, offset, numItems);
                                  offset                        += numItems * 4;
                                  // TODO handle big endian
                          }else        console.assert(false);
                  }
                  console.assert(vertexIdxArray)
                  console.assert(vertexPosArray)
                  console.assert(vertexUvArray)
                  
                  // fill the attributes
                  var attributes = {
                          index                : {
                                  itemSize: 1,
                                  array        : vertexIdxArray,
                                  numItems: vertexIdxArray.length
                          },
                          position        : {
                                  itemSize: 3,
                                  array        : vertexPosArray,
                                  numItems: vertexPosArray.length
                          },
                          uv        : {
                                  itemSize: 2,
                                  array        : vertexUvArray,
                                  numItems: vertexUvArray.length
                          }
                  };
                  var offsets        = [{
                          start        : 0,
                          count        : vertexIdxArray.length,
                          index        : 0
                  }];
  
                  // build BufferGeometry
                  var tGeometry                = new THREE.BuffertGeometry();
                  tGeometry.attributes        = attributes;
                  tGeometry.offsets        = offsets;
                  tGeometry.computeBoundingBox();
                  tGeometry.computeBoundingSphere();
                  tGeometry.computeVertexNormals();
                  //var material        = new THREE.MeshNormalMaterial();
                  var material        = new THREE.MeshBasicMaterial({
                          color        : 0xffffff,
                          map        : THREE.ImageUtils.loadTexture( "../../assets/images/ash_uvgrid01.jpg" )
                  });
                  var mesh        = new THREE.Mesh(tGeometry, material);
                  world.add(mesh);
          }
          xhr.send();
          
  </script></body>


(C) Æliens 04/09/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.