three打造一款360全景三维水滴悬浮空中效果代码-html代码-BFW代码库

three打造一款360全景三维水滴悬浮空中效果代码

代码语言：html

所属分类：三维

代码描述：three打造一款360全景三维水滴悬浮空中效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<html lang="en">
<head>

    <meta charset="UTF-8">




</head>

<body>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.126.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/OrbitControls.126.js"></script>
    <script>
        const scene = new THREE.Scene();
        const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
        camera.position.z = -2.5;
        camera.position.x = -5;

        const ambient = new THREE.AmbientLight(0xffffff);
        scene.add(ambient);

        const renderer = new THREE.WebGLRenderer();
        renderer.setSize(window.innerWidth, window.innerHeight);
        document.body.appendChild(renderer.domElement);

        let tooLazyToHandleLoadingProperly = 0;
        const loadingLol = () => tooLazyToHandleLoadingProperly++;
        const ENV_URL = '//repo.bfw.wiki/bfwrepo/image/604ff881ee77f.png';
        const reflectionCube = new THREE.TextureLoader().load(ENV_URL, loadingLol);
        const refractionCube = new THREE.TextureLoader().load(ENV_URL, loadingLol);
        reflectionCube.mapping = THREE.EquirectangularReflectionMapping;
        refractionCube.mapping = THREE.EquirectangularRefractionMapping;
        scene.background = reflectionCube;
        scene.environment = reflectionCube;

        const geometry = new THREE.SphereGeometry(2, 128, 128);
        const base = geometry.attributes.position.array.slice();
        const refractionMaterial = new THREE.MeshPhysicalMaterial({
            color: 0xc3e4f9,
            envMap: refractionCube,
            metalness: 1,
            reflectivity: 0,
            refractionRatio: .1,
            roughness: 0,
            side: THREE.DoubleSide
        });

        const reflectionMaterial = new THREE.MeshPhysicalMaterial({
            color: 0xc3e4f9,
            clearCoat: .1,
            clearCoatRough: .2,
            envM.........完整代码请登录后点击上方下载按钮下载查看