JavaScript
- 20 ответов
- 0 вопросов
16
Вклад в тег
//создаем сцену
const scene = new THREE.Scene();
//создаем камеру на основе ширины и высоты окна
const camera = new THREE.PerspectiveCamera(75,window.innerWidth/window.innerHeight);
//создаем рендерер, определяем его размеры
const renderer = new THREE.WebGLRenderer({antialias: true});
renderer.setSize(window.innerWidth,window.innerHeight);
//отрисовываем в нужном месте
$('body').append(renderer.domElement);
//создаем меш (состоит из геометрии и материала)
const geometry = new THREE.BoxGeometry(1,1,1);
const material = new THREE.MeshBasicMaterial({color: 0xff0000});
const cube = new THREE.Mesh(geometry,material);
//добавляем его на сцену
scene.add(cube);
//позиционируем
cube.position.z = -5;
cube.rotation.x = 10;
cube.rotation.y = 5;
//рендерим
renderer.render(scene,camera);
//добавляем анимацию
let animate = function(){
//задаем вращение
cube.rotation.x += 0.01;
renderer.render(scene,camera);
//просим у браузера обновлять анимацию перед каждой перерисовкой
requestAnimationFrame(animate);
}
animate();