Permalink
Browse files

Wireframe rendering is now way faster.

  • Loading branch information...
1 parent 2796c12 commit efa86ea7e017696fd0e0f4743e863bd7718e844a @stephomi committed Dec 28, 2013
Showing with 47 additions and 56 deletions.
  1. +1 −1 object/mesh.js
  2. +37 −49 object/render.js
  3. +0 −1 shaders/wireframe.frag
  4. +9 −5 shaders/wireframe.vert
View
@@ -286,7 +286,7 @@ Mesh.prototype = {
/** Update the rendering buffers */
updateBuffers: function ()
{
- this.render_.updateBuffers(this.vertexArray_, this.normalArray_, this.colorArray_, this.indexArray_);
+ this.render_.updateBuffers(this.vertexArray_, this.normalArray_, this.colorArray_, this.indexArray_, this.triangles_.length);
},
/** Update geometry */
View
@@ -8,7 +8,6 @@ function Render(gl)
this.vertexBuffer_ = null; //vertices buffer
this.normalBuffer_ = null; //normals buffer
this.colorBuffer_ = null; //colors buffer
- this.barycenterBuffer_ = null; //barycenter buffer
this.indexBuffer_ = null; //indexes buffer
this.reflectionLoc_ = null; //texture reflection
@@ -19,7 +18,6 @@ function Render(gl)
this.vertexAttrib_ = null; //vertex attribute location
this.colorAttrib_ = null; //color vertex attribute location
this.normalAttrib_ = null; //normal attribute location
- this.barycenterAttrib_ = null; //barycenter attribute location
this.mvpMatrixUnif_ = null; //model view projection matrix uniform location
this.mvMatrixUnif_ = null; //model view matrix uniform location
@@ -32,6 +30,9 @@ function Render(gl)
this.lineNormalUnif_ = null; //line normal uniform location
this.reflectionTexUnif_ = null; //reflection texture uniform location
+
+ this.cacheDrawArraysV_ = null; //cache array for vertices
+ this.cacheDrawArraysN_ = null; //cache array for normals
}
//the rendering mode
@@ -87,9 +88,7 @@ Render.prototype = {
this.vertexAttrib_ = gl.getAttribLocation(this.shaderProgram_, 'vertex');
this.normalAttrib_ = gl.getAttribLocation(this.shaderProgram_, 'normal');
- if (this.shaderType_ === Render.mode.WIREFRAME)
- this.barycenterAttrib_ = gl.getAttribLocation(this.shaderProgram_, 'barycenter');
- else if (this.shaderType_ !== Render.mode.NORMAL)
+ if (this.shaderType_ !== Render.mode.NORMAL && this.shaderType_ !== Render.mode.WIREFRAME)
this.colorAttrib_ = gl.getAttribLocation(this.shaderProgram_, 'color');
this.mvpMatrixUnif_ = gl.getUniformLocation(shaderProgram, 'mvpMat');
@@ -115,7 +114,7 @@ Render.prototype = {
{
var gl = this.gl_;
this.vertexShader_ = gl.createShader(gl.VERTEX_SHADER);
- gl.shaderSource(this.vertexShader_, '\n'+vertex+'\n');
+ gl.shaderSource(this.vertexShader_, '\n' + vertex + '\n');
gl.compileShader(this.vertexShader_);
this.fragmentShader_ = gl.createShader(gl.FRAGMENT_SHADER);
gl.shaderSource(this.fragmentShader_, fragment);
@@ -162,7 +161,10 @@ Render.prototype = {
gl.enableVertexAttribArray(this.normalAttrib_);
gl.bindBuffer(gl.ARRAY_BUFFER, this.normalBuffer_);
- gl.vertexAttribPointer(this.normalAttrib_, 3, gl.FLOAT, false, 0, 0);
+ if (this.shaderType_ === Render.mode.WIREFRAME)
+ gl.vertexAttribPointer(this.normalAttrib_, 4, gl.FLOAT, false, 0, 0);
+ else
+ gl.vertexAttribPointer(this.normalAttrib_, 3, gl.FLOAT, false, 0, 0);
if (this.shaderType_ !== Render.mode.WIREFRAME && this.shaderType_ !== Render.mode.NORMAL)
{
@@ -193,9 +195,6 @@ Render.prototype = {
gl.depthMask(true);
break;
case Render.mode.WIREFRAME:
- gl.enableVertexAttribArray(this.barycenterAttrib_);
- gl.bindBuffer(gl.ARRAY_BUFFER, this.barycenterBuffer_);
- gl.vertexAttribPointer(this.barycenterAttrib_, 3, gl.FLOAT, false, 0, 0);
gl.drawArrays(gl.TRIANGLES, 0, lengthIndexArray);
break;
case Render.mode.NORMAL:
@@ -219,11 +218,11 @@ Render.prototype = {
},
/** Update buffers */
- updateBuffers: function (vAr, nAr, cAr, iAr)
+ updateBuffers: function (vAr, nAr, cAr, iAr, nbTriangles)
{
if (this.shaderType_ === Render.mode.WIREFRAME)
{
- this.makeWireframeBuffers(vAr, nAr, iAr);
+ this.makeWireframeBuffers(vAr, nAr, iAr, nbTriangles);
return;
}
var gl = this.gl_;
@@ -241,53 +240,42 @@ Render.prototype = {
},
/** Create arrays for the drawArrays function */
- makeWireframeBuffers: function (vAr, nAr, iAr)
+ makeWireframeBuffers: function (vAr, nAr, iAr, nbTriangles)
{
var gl = this.gl_;
- var vArray = new Float32Array(iAr.length * 3);
+
+ var cdv = this.cacheDrawArraysV_;
+ var cdn = this.cacheDrawArraysN_;
+ if (cdv === null || cdv.length <= nbTriangles * 9)
+ {
+ this.cacheDrawArraysV_ = new Float32Array(nbTriangles * 9 * 1.5);
+ this.cacheDrawArraysN_ = new Float32Array(nbTriangles * 12 * 1.5);
+ cdv = this.cacheDrawArraysV_;
+ cdn = this.cacheDrawArraysN_;
+ }
+
var i = 0,
j = 0,
id = 0;
- for (i = 0; i < iAr.length; ++i)
+ var len = nbTriangles * 9;
+ for (i = 0; i < len; ++i)
{
j = i * 3;
id = iAr[i] * 3;
- vArray[j] = vAr[id];
- vArray[j + 1] = vAr[id + 1];
- vArray[j + 2] = vAr[id + 2];
+ cdv[j] = vAr[id];
+ cdv[j + 1] = vAr[id + 1];
+ cdv[j + 2] = vAr[id + 2];
+
+ j = i * 4;
+ cdn[j] = nAr[id];
+ cdn[j + 1] = nAr[id + 1];
+ cdn[j + 2] = nAr[id + 2];
+ cdn[j + 3] = i % 3;
}
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer_);
- gl.bufferData(gl.ARRAY_BUFFER, vArray, gl.DYNAMIC_DRAW);
+ gl.bufferData(gl.ARRAY_BUFFER, cdv, gl.DYNAMIC_DRAW);
- var nArray = new Float32Array(iAr.length * 3);
- for (i = 0; i < iAr.length; ++i)
- {
- j = i * 3;
- id = iAr[i] * 3;
- nArray[j] = nAr[id];
- nArray[j + 1] = nAr[id + 1];
- nArray[j + 2] = nAr[id + 2];
- }
gl.bindBuffer(gl.ARRAY_BUFFER, this.normalBuffer_);
- gl.bufferData(gl.ARRAY_BUFFER, nArray, gl.DYNAMIC_DRAW);
-
- var baryArray = new Float32Array(iAr.length * 3);
- for (i = 0; i < iAr.length / 3; ++i)
- {
- j = i * 9;
- baryArray[j] = 1;
- baryArray[j + 1] = 0;
- baryArray[j + 2] = 0;
- baryArray[j + 3] = 0;
- baryArray[j + 4] = 1;
- baryArray[j + 5] = 0;
- baryArray[j + 6] = 0;
- baryArray[j + 7] = 0;
- baryArray[j + 8] = 1;
- }
- if (!this.barycenterBuffer_)
- this.barycenterBuffer_ = gl.createBuffer();
- gl.bindBuffer(gl.ARRAY_BUFFER, this.barycenterBuffer_);
- gl.bufferData(gl.ARRAY_BUFFER, baryArray, gl.DYNAMIC_DRAW);
+ gl.bufferData(gl.ARRAY_BUFFER, cdn, gl.DYNAMIC_DRAW);
}
-};
+};
@@ -8,7 +8,6 @@ varying vec3 vNormal;
varying vec3 vBarycenter;
const vec3 colorBackface = vec3(0.81, 0.71, 0.23);
const vec4 colorCutPlane = vec4(0.81, 0.31, 0.23, 1.0);
-
const vec3 vecLight = vec3(0.06189844605901729, 0.12379689211803457, 0.9903751369442766);
const float shininess = 100.0;
void main()
@@ -1,17 +1,21 @@
attribute vec3 vertex;
-attribute vec3 normal;
-attribute vec3 barycenter;
+attribute vec4 normal;
uniform mat4 mvMat, mvpMat;
uniform mat3 nMat;
varying vec3 vVertex;
varying vec3 vNormal;
varying vec3 vBarycenter;
-varying vec2 vTexCoord;
void main()
{
- vBarycenter = barycenter;
vec4 vertex4 = vec4(vertex, 1.0);
- vNormal = nMat * normal;
+ float bVal = normal[3];
+ if(bVal > 1.5)
+ vBarycenter = vec3(0,0,1);
+ else if(bVal < 0.5)
+ vBarycenter = vec3(0,1,0);
+ else
+ vBarycenter = vec3(1,0,0);
+ vNormal = nMat * vec3(normal);
vVertex = vec3(mvMat * vertex4);
gl_Position = mvpMat * vertex4;
}

0 comments on commit efa86ea

Please sign in to comment.