three实现三维星星旋转动画效果代码-html代码-BFW代码库

three实现三维星星旋转动画效果代码

代码语言：html

所属分类：三维

代码描述：three实现三维星星旋转动画效果代码

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

<!DOCTYPE html>
<html lang="en" >

<head>

  <meta charset="UTF-8">
  

  
  
  
  
<style>
* {
  margin: 0;
  padding: 0;
}
canvas {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
}
</style>

 


</head>

<body >

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.145.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/RGBELoader.145.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/OrbitControls.145.js"></script>
      <script >
!function () {
  "use strict";
  let e,
  t,
  o,
  n,
  a,
  i,
  r,
  l,
  d,
  s,
  E,
  c = 5,
  m = 1,
  w = "",
  h = new THREE.Group(),
  p = new THREE.Group();
  function R() {
    e.aspect = window.innerWidth / window.innerHeight,
    e.updateProjectionMatrix(),
    o.setSize(window.innerWidth, window.innerHeight);
  }
  function H() {
    requestAnimationFrame(H),
    n.update(),
    h.rotation.x += 0.003,
    h.rotation.y -= 0.005,
    h.rotation.z -= 0.002,
    p.rotation.x -= 0.002,
    p.rotation.y -= 0.005,
    p.rotation.z += 0.001,
    o.render(t, e);
  }
  !function () {
    const u = document.createElement("div");
    document.body.appendChild(u),
    (t = new THREE.Scene()).background = 0,
    (o = new THREE.WebGLRenderer({
      antialias: !0 })).
    setPixelRatio(window.devicePixelRatio),
    o.setSize(window.innerWidth, window.innerHeight),
    o.outputEncoding = THREE.sRGBEncoding,
    o.shadowMap.enabled = !0,
    u.appendChild(o.domElement),
    new THREE.RGBELoader().load(
    "//repo.bfw.wiki/bfwrepo/threemodel/leadenhall_market_1k.hdr",
    function (e) {
      e.mapping = THREE.EquirectangularReflectionMapping,
      e.flipY = !1,
      t.environment = e;
    }),

    (e = new THREE.PerspectiveCamera(
    35,
    window.innerWidth / window.innerHeight,
    0.01,
    500)).
    position.set(0, 0, 13),
    e.lookAt(0, 0, 0),
    (n = new THREE.OrbitControls(e, o.domElement)).autoRotate = !0,
    n.autoRotateSpeed = 2,
    n.enableDamping = !0,
    n.enablePan = !1,
    n.minDistance = 3,
    n.maxDistance = 30,
    n.minPolarAngle = 0,
    n.maxPolarAngle = Math.PI / 2,
    n.target.set(0, 0, 0),
    n.update(),
    H();
    const T = new THREE.AmbientLight(16777215, 0.2);
    t.add(T),
    i = new THREE.MeshStandardMaterial({
      color: 3355647,
      metalness: 0.8,
      roughness: 0 }),

    E = 0.15,
    a = new THREE.IcosahedronGeometry(E, 0),
    d = new THREE.Mesh(a, i),
    E = 0.3,
    a = new THREE.SphereGeometry(E, 20, 20),
    s = new THREE.Mesh(a, new THREE.MeshStandardMaterial()),
    t.add(h),
    function (e, t, o, n = "") {
      a = new THREE.IcosahedronGeometry(t, o);
      let d = [];
      for (let e = 0; e < a.attributes.position.count; e++) {
        let t = new THREE.Vector3();
        t.........完整代码请登录后点击上方下载按钮下载查看