使用three.js的Javascript 3D效果

Question

這是我第二次使用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);
        });
    },

編輯2：

我計算出：我需要添加約5個透明同心鏡，並將產品放在每個（隨機位置）上，並將相機置於所有鏡心的中心，然后旋轉。 Buut，如何將圖像隨機放置在cilinider上？ 我真的有一個障礙

Answer 1

在three.js網站上，您可以找到大量的示例 ，這些示例可以向您展示什么是可能的以及如何實現。 不要指望僅3個小時就能成為專家。