What’s on our mind?

Collection of articles, design, site, and resources made by designers and publisher @Menu View

**
//화면 생성
    let scene = new THREE.Scene();

    //카메라 설정
    let camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 5000);
    camera.position.z = 500;

    //렌더링 설정
    let renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth, window.innerHeight);
    renderer.setPixelRatio(window.devicePixelRatio > 1 ? 2 : 1);
    document.body.appendChild(renderer.domElement);

    //컨트롤 설정
    const controlsWebGL = new THREE.OrbitControls(camera, renderer.domElement);
    
    //모양 설정(파티클 설정)
    const path = document.querySelector("path");
    const length = path.getTotalLength(); //svg 총 길이
    const vertices = [];

    for (let i=0; i<length; i += 0.2) {
        const point = path.getPointAtLength(i);
        const vector = new THREE.Vector3(point.x, -point.y, 0);
        vector.x += (Math.random() - 0.5) * 30;
        vector.y += (Math.random() - 0.5) * 30;
        vector.z += (Math.random() - 0.5) * 70;
        vertices.push(vector);
    }

    const geometry = new THREE.BufferGeometry().setFromPoints(vertices);
    const material = new THREE.PointsMaterial({color: 0xee5282, blending: THREE.AdditiveBlending, size: 3});
    const particles = new THREE.Points(geometry, material);
    particles.position.x -= 600 / 2;
    particles.position.y += 552 / 2;
    scene.add(particles);

    //조명 설정

    //애니메이션 설정
    function animate() {
        requestAnimationFrame(animate);

        renderer.render(scene, camera);
    }
    animate();

    //애니메이션 설정
    gsap.fromTo(scene.rotation, {
        y: -3
    }, {
        y: 0.3,
        repeat: -1,
        yoyo: true,
        ease: 'power2.inOut',
        duration: 3
    });

    //화면 사이즈 설정
    function onWindowResize() {
        camera.aspect = window.innerWidth / window.innerHeight;
        camera.updateProjectionMatrix();
        renderer.setSize(window.innerWidth, window.innerHeight);
    }
    window.addEventListener('resize', onWindowResize);