Эффект Javascript 3D с использованием three.js

75
5

Это мой второй раз, когда я использую three.js, и я играю в течение как минимум 3 часов. Кажется, я не могу найти направление.

Я должен построить что-то вроде этого: https://www.g-star.com/nl_nl/newdenimarrivals

Я создал сцену и все, но я не могу найти формулу или что-либо о том, как организовать такие продукты (не говоря уже о том, что я должен обрабатывать события щелчка после этого и перемещать камеру на этот продукт).

У вас, ребята, есть что-нибудь?

РЕДАКТИРОВАТЬ:

Вот как я пытаюсь организовать продукты.

    arrangeProducts: function () {
var self = this;

this.products.forEach(function (element, index) {

THREE.ImageUtils.crossOrigin = '';

element.image = 'http://i.imgur.com/CSyFaYS.jpg';

//texture
var texture = THREE.ImageUtils.loadTexture(element.image, null);
texture.magFilter = THREE.LinearMipMapLinearFilter;
texture.minFilter = THREE.LinearMipMapLinearFilter;

//material
var material = new THREE.MeshBasicMaterial({
map: texture
});

//plane geometry
var geometry = new THREE.PlaneGeometry(element.width, element.height);

//plane
var plane = new THREE.Mesh(geometry, material);
plane.overdraw = true;

//set the random locations
/*plane.position.x = Math.random() * (self.container.width - element.width);
plane.position.y = Math.random() * (self.container.height - element.height);*/
plane.position.z = -2500 + (Math.random() * 50) * 50;

plane.position.x = Math.random() * self.container.width - self.container.width / 2;
plane.position.y = Math.random() * 200 - 100;

//add the plane to the scene
self.scene.add(plane);
});
},

EDIT 2:

Я понял: мне нужно добавить около 5 прозрачных концентрических цилиндров и поместить продукты на каждое (случайное местоположение), а камера - в центре всех цилиндров и просто повернуть. Буут, как я помещаю изображения на цилинидер случайно? У меня действительно есть блокировка

спросил(а) 2021-01-28T01:06:56+03:00 3 месяца, 1 неделя назад
1
Решение
62

На веб-сайте three.js вы найдете целую кучу примеров, которые могут показать вам, что возможно и как это сделать. Не ожидайте быть экспертом всего за 3 часа.

ответил(а) 2021-01-28T01:06:56+03:00 3 месяца, 1 неделя назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема