Skip to content

T
three.js

Ablesons / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

体验新版 GitCode，发现更多精彩内容 >>

提交 8f5c2c9e 编写于 作者: M Mr.doob
浏览文件
操作

Merge branch 'gpgpu_birds_buffer' of https://github.com/zz85/three.js into dev 

Conflicts:
	examples/webgl_gpgpu_birds.html
上级 6d175222 79d8e9a4
隐藏空白更改
内联 并排
Showing with 74 addition and 106 deletion
examples/js/SimulatorRenderer.js → examples/js/SimulationRenderer.js
浏览文件 @ 8f5c2c9e
......@@ -10,7 +10,7 @@
*
*/
function SimulatorRenderer(WIDTH, renderer) {
function SimulationRenderer(WIDTH, renderer) {
WIDTH = WIDTH || 4;
var camera = new THREE.Camera();
......
examples/webgl_gpgpu_birds.html
浏览文件 @ 8f5c2c9e
......@@ -43,11 +43,10 @@
<script src="js/libs/stats.min.js"></script>
<script src="js/libs/dat.gui.min.js"></script>
<script src="js/SimulatorRenderer.js"></script>
<script src="js/SimulationRenderer.js"></script>
<!--
TODO: If you're reading this, you may wish to improve this example by
- Replacing the custom BirdGeometry with a BufferGeometry?
- Create a better shading for the birds?
- Refactoring the SimulationRenderer to a more generic TextureRenderer / making the GPGPU workflow easier?
......@@ -289,8 +288,6 @@
uniform sampler2D texturePosition;
uniform sampler2D textureVelocity;
varying vec3 vNormal;
varying vec2 vUv;
varying vec4 vColor;
varying float z;
......@@ -298,8 +295,6 @@
void main() {
vNormal = normal;
vec4 tmpPos = texture2D( texturePosition, reference );
vec3 pos = tmpPos.xyz;
vec3 velocity = normalize(texture2D( textureVelocity, reference ).xyz);
......@@ -352,8 +347,6 @@
<!-- bird geometry shader -->
<script type="x-shader/x-fragment" id="birdFS">
varying vec3 vNormal;
varying vec2 vUv;
varying vec4 vColor;
varying float z;
......@@ -364,15 +357,6 @@
float z2 = 0.2 + ( 1000. - z ) / 1000. * vColor.x;
gl_FragColor = vec4( z2, z2, z2, 1. );
// vec3 light = vec3( 0.0, 1.0, 1.0 );
// light = normalize( light );
// float dProd = dot( vNormal, light ) ; //* 0.5 + 0.5;
// vec4 tcolor = vColor;
// vec4 gray = vec4( vec3( tcolor.r * 0.3 + tcolor.g * 0.59 + tcolor.b * 0.11 ), 1.0 );
// gl_FragColor = gray * dProd;
// gl_FragColor = vec4( dProd * tcolor );
}
</script>
......@@ -388,89 +372,94 @@
/* TEXTURE WIDTH FOR SIMULATION */
var WIDTH = hash || 32;
var BIRDS = 1024;
var BIRDS = WIDTH * WIDTH;
// Custom Geometry
// Custom Geometry - using 3 triangles each. No UVs, no normals currently.
THREE.BirdGeometry = function () {
THREE.Geometry.call( this );
var triangles = BIRDS * 3;
var points = triangles * 3;
THREE.BufferGeometry.call( this );
// THREE.Geometry2.call( this, points );
var vertices = new Float32Array( points * 3 );
var birdColors = new Float32Array( points * 3 );
var references = new Float32Array( points * 2 );
var birdVertex = new Float32Array( points );
BIRDS = WIDTH * WIDTH;
this.addAttribute( 'position', vertices, 3 );
this.addAttribute( 'birdColor', birdColors, 3 );
this.addAttribute( 'reference', references, 2 );
this.addAttribute( 'birdVertex', birdVertex, 1 );
var verts = this.vertices;
var faces = this.faces;
var uvs = this.faceVertexUvs[ 0 ];
// this.addAttribute( 'normal', new Float32Array( points * 3 ), 3 );
var v = 0;
function verts_push() {
for (var i=0; i < arguments.length; i++) {
vertices[v++] = arguments[i];
}
}
var fi = 0;
var wingsSpan = 20;
for (var f = 0; f<BIRDS; f++ ) {
verts.push(
new THREE.Vector3(0, -0, -20),
new THREE.Vector3(0, 4, -20),
new THREE.Vector3(0, 0, 30)
// Body
verts_push(
0, -0, -20,
0, 4, -20,
0, 0, 30
);
faces.push(new THREE.Face3(
fi++,
fi++,
fi++
));
// Left Wing
verts_push(
0, 0, -15,
-wingsSpan, 0, 0,
0, 0, 15
);
uvs.push([
new THREE.Vector2(0, 0),
new THREE.Vector2(0, 1),
new THREE.Vector2(1, 1)
]);
// Right Wing
verts_push(
0, 0, 15,
wingsSpan, 0, 0,
0, 0, -15
);
var wingsSpan = 20;
}
verts.push(
new THREE.Vector3(0, 0, -15),
new THREE.Vector3(-wingsSpan, 0, 0),
new THREE.Vector3(0, 0, 15)
);
for( var v = 0; v < triangles * 3; v++ ) {
verts.push(
new THREE.Vector3(0, 0, 15),
new THREE.Vector3(wingsSpan, 0, 0),
new THREE.Vector3(0, 0, -15)
var i = ~~(v / 3);
var x = (i % WIDTH) / WIDTH;
var y = ~~(i / WIDTH) / WIDTH;
var c = new THREE.Color(
0x444444 +
~~(v / 9) / BIRDS * 0x666666
);
faces.push(new THREE.Face3(
fi++,
fi++,
fi++
));
faces.push(new THREE.Face3(
fi++,
fi++,
fi++
));
uvs.push([
new THREE.Vector2(0, 0),
new THREE.Vector2(0, 1),
new THREE.Vector2(1, 1)
]);
uvs.push([
new THREE.Vector2(0, 0),
new THREE.Vector2(0, 1),
new THREE.Vector2(1, 1)
]);
birdColors[ v * 3 + 0 ] = c.r;
birdColors[ v * 3 + 1 ] = c.g;
birdColors[ v * 3 + 2 ] = c.b;
references[ v * 2 ] = x;
references[ v * 2 + 1 ] = y;
birdVertex[ v ] = v % 9;
}
this.applyMatrix( new THREE.Matrix4().makeScale( 0.2, 0.2, 0.2 ) );
this.computeFaceNormals();
this.computeVertexNormals();
}
THREE.BirdGeometry.prototype = Object.create( THREE.Geometry.prototype );
THREE.BirdGeometry.prototype = Object.create( THREE.BufferGeometry.prototype ); // Geometry2
var container, stats;
......@@ -539,7 +528,7 @@
renderer.autoClear = true;
////////
simulator = new SimulatorRenderer(WIDTH, renderer);
simulator = new SimulationRenderer(WIDTH, renderer);
simulator.init();
......@@ -633,18 +622,18 @@
// For Vertex Shaders
birdAttributes = {
index: { type: 'i', value: [] },
birdColor: { type: 'c', value: [] },
reference: { type: 'v2', value: [] },
birdVertex: { type: 'f', value: [] },
// index: { type: 'i', value: [] },
birdColor: { type: 'c', value: null },
reference: { type: 'v2', value: null },
birdVertex: { type: 'f', value: null }
};
// For Vertex and Fragment
birdUniforms = {
color: { type: "c", value: new THREE.Color( 0xff2200 ) },
texturePosition: { type: "t", value: null },
textureVelocity: { type: "t", value: null },
color: { type: "c", value: new THREE.Color( 0xff2200 ) },
texturePosition: { type: "t", value: null },
textureVelocity: { type: "t", value: null },
time: { type: "f", value: 1.0 },
delta: { type: "f", value: 0.0 },
......@@ -657,33 +646,12 @@
attributes: birdAttributes,
vertexShader: document.getElementById( 'birdVS' ).textContent,
fragmentShader: document.getElementById( 'birdFS' ).textContent,
side: THREE.DoubleSide,
// wireframe: true
side: THREE.DoubleSide
});
// geometry.dynamic = false;
var vertices = geometry.vertices;
var birdColors = birdAttributes.birdColor.value;
var references = birdAttributes.reference.value;
var birdVertex = birdAttributes.birdVertex.value;
for( var v = 0; v < vertices.length; v++ ) {
var i = ~~(v / 3);
var x = (i % WIDTH) / WIDTH;
var y = ~~(i / WIDTH) / WIDTH;
birdColors[ v ] = new THREE.Color(
0x444444 +
~~(v / 9) / BIRDS * 0x666666
);
references[ v ] = new THREE.Vector2( x, y );
birdVertex[ v ] = v % 9;
}
// var
birdMesh = new THREE.Mesh( geometry, shaderMaterial );
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或