Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.07.2014, 23:35
Аспирант
Отправить личное сообщение для SVARAI Посмотреть профиль Найти все сообщения от SVARAI
 
Регистрация: 30.11.2013
Сообщений: 41

Как перемещать объект в 3Д пространстве?
Вот сижу и думаю, как сделать так, чтобы при изменении угла поворота корабля, он летел относительно этого угла. Пишу я это все на Three js.
При изменении этих двух углов корабль может лететь в любых направления, но как бы не так... В теории.
x+=Math.sin(angle)*speed+Msth.sin(angle2)*speed
y+=Math.cos(angle)*speed
z+=Math.cos(angle2)*speed

Я понимаю, что здесь все через ***, но все же... В three js вообще все по другому, странная система координат. Для 2Д я такое делал таким образом:
x+=Math.cos(angle)*speed;
y+=Math.sin(angle)*speed;

Но ни как не могу придумать, как прикрутить сюда третью ось... Помоги пожалуйста)
Вот код:
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 20000);

var light = new THREE.PointLight( 0xffffff, 1, 2000 );
light.position.set(0,0,0);scene.add( light );

var x = 0, y = 0, z = -500, speed = 0, angle = 0, angle2 = 0;

var geometry = new THREE.CylinderGeometry( 4, 15	, 100, 6 );
var material = new THREE.MeshLambertMaterial( {color: 0xffffff} );
var cylinder = new THREE.Mesh( geometry, material );
scene.add( cylinder );

var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
renderer.shadowMapEnabled = true;
renderer.setClearColorHex( 0x00000, 1 );

var render = function () {
	requestAnimationFrame(render);
	renderer.render(scene, camera);
	switch (key){ 
		case 38: angle2+=0.1; break;
		case 40: angle2-=0.1; break;
		case 37: angle+=0.1; break;
		case 39: angle-=0.1; break;

		case 90: speed-=0.5; break;
		case 88: speed+=0.5; break;
	}
	light.position.set(camera.position.x,camera.position.y+3,camera.position.z-3);

	cylinder.rotation.z=-angle;
	cylinder.position.set( x+=Math.sin(angle)*speed*2, y+=Math.cos(angle)*speed, z );
};
document.onkeydown = keyDn; document.onkeyup = keyUp; key=0;
function keyDn(e) {key = e.which;console.log(key)}
function keyUp(e) {key = 0;}
render();
Ответить с цитированием
  #2 (permalink)  
Старый 10.07.2014, 23:50
Аспирант
Отправить личное сообщение для SVARAI Посмотреть профиль Найти все сообщения от SVARAI
 
Регистрация: 30.11.2013
Сообщений: 41

Ну... Хотя бы в теории. Там есть x,y,z и два угла. Что от чего зависит для перемещения в 3ехмерном пространстве?
Ответить с цитированием
  #3 (permalink)  
Старый 11.07.2014, 00:27
Аватар для MallSerg
Профессор
Отправить личное сообщение для MallSerg Посмотреть профиль Найти все сообщения от MallSerg
 
Регистрация: 07.03.2011
Сообщений: 1,126

Никто не использует углы(углы эйлера) в трехмерной графике используют кватернионы а лучше возьми и делай по какому нибуть учебнику
Ответить с цитированием
  #4 (permalink)  
Старый 11.07.2014, 00:36
Аспирант
Отправить личное сообщение для SVARAI Посмотреть профиль Найти все сообщения от SVARAI
 
Регистрация: 30.11.2013
Сообщений: 41

Да, спасибо... Но мне бы просто формулу...
Ответить с цитированием
  #5 (permalink)  
Старый 11.07.2014, 11:08
Аспирант
Отправить личное сообщение для SVARAI Посмотреть профиль Найти все сообщения от SVARAI
 
Регистрация: 30.11.2013
Сообщений: 41

Мне посоветовали делать так:
x+=cos(an0)*sp; 
y+=cos(an1)*sp;
z+=cos(an2)*sp;

Но при этом результат не лучше... Что делать?
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 20000);

var light = new THREE.PointLight( 0xffffff, 1, 2000 );
light.position.set(0,0,0);scene.add( light );

var x = 0, y = 0, z = -500, speed = 0.3, angle0 = 0, angle1 = 0, angle2 = 0;

var geometry = new THREE.CylinderGeometry( 4, 15	, 100, 6 );
var material = new THREE.MeshLambertMaterial( {color: 0xffffff} );
var cylinder = new THREE.Mesh( geometry, material );
scene.add( cylinder );

var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
renderer.shadowMapEnabled = true;
renderer.setClearColorHex( 0x00000, 1 );

var render = function () {
	requestAnimationFrame(render);
	renderer.render(scene, camera);
	switch (key){ 
		case 38: angle1+=0.1; break;
		case 40: angle1-=0.1; break;
		case 37: angle0+=0.1; break;
		case 39: angle0-=0.1; break;

		case 90: angle2-=0.1; break;
		case 88: angle2+=0.1; break;
	}
	light.position.set(camera.position.x,camera.position.y+3,camera.position.z-3);

	cylinder.rotation.z=angle2;
	//cylinder.rotation.y=angle1;
	cylinder.rotation.x=angle0;
	cylinder.position.set( x+=Math.sin(angle0)*speed*2, y+=Math.cos(angle0)*speed, z+=Math.cos(angle2)*speed );
};
document.onkeydown = keyDn; document.onkeyup = keyUp; key=0;
function keyDn(e) {key = e.which;console.log(key)}
function keyUp(e) {key = 0;}
render();
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как определить что объект принадлежит к разделу нативного DOM объекта devote Оффтопик 11 21.06.2014 00:39
Как из строки содержащей namespace получить ссылку на объект? wwwboy Общие вопросы Javascript 2 07.12.2011 09:22
Как сделать объект не изменяемым? Major_Krieg Серверные языки и технологии 1 07.11.2009 02:54
Подскажите как узнать существует ли объект в памяти? Yazla Общие вопросы Javascript 2 05.11.2009 20:05
Как заставить this в обработчике события указывать на объект? Dmitryk Events/DOM/Window 3 16.03.2009 08:45