1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
|
// Задача: чрез използването на ParametricGeometry
// създайте вълнообразна повърхност.
var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
renderer.setAnimationLoop( drawFrame );
document.body.appendChild( renderer.domElement );
var scene = new THREE.Scene();
var aspect = window.innerWidth/window.innerHeight;
var camera = new THREE.PerspectiveCamera( 30, aspect );
camera.position.set( 0, 0, 3 );
camera.lookAt( new THREE.Vector3() );
// Тази функция е дефинирана в диапазона u=[0,1] и v=[0,1]
// като изчислява координатите (x,y,z) на повърхност в
// точка, определена от (u,v). Т.е. функцията реализира
// функциите x(u,v), y(u,v) и z(u,v).
function myFunc( u, v, point )
{
// В този пример се генерира равна повърхност z=0 за
// x=[-0.5,0.5] и y=[-0.5,0.5] - това е квадрат от (-0.5,-0.5,0) до (0.5,0.5,0)
// Вместо равната повърхност трябва да сложите вълнообразна
point.set( u-0.5, v-0.5, Math.sin(Math.sqrt((u - 0.5)*(u - 0.5) + (v - 0.5)*(v - 0.5)) * 32) / 32);
}
// Създаваме параметрична форма, която е квадрат, разделен
// на 100х100 квадратчета. Колкото са повече на брой тези
// квадратчета, толкова по-гладка ще е формата, но и по-тежка
// за работа.
var waves = new THREE.ParametricGeometry( myFunc, 100, 100 );
// Three.js оптимизира повърхнините, като не рисува обратната
// им страна. Но на нашата повърхности искаме да я гледаме от
// двете страни, затова казваме, че искаме да е DoubleSide
var material = new THREE.MeshPhongMaterial( {side:THREE.DoubleSide} );
var surface = new THREE.Mesh( waves, material );
scene.add( surface );
// Светлини
var light = new THREE.PointLight();
light.position.set( 0, 0, 20 );
scene.add( light );
function drawFrame()
{
surface.rotation.y += 0.005;
renderer.render( scene, camera );
}
|
