three+ammo实现雪地中三维雪人下雪动画效果代码-html代码-BFW代码库

代码语言：html

所属分类：三维

代码描述：three+ammo实现雪地中三维雪人下雪动画效果代码

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

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

<head>

  <meta charset="UTF-8">
  

  
  
  
<style>
* {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin: 0;
  padding: 0;
}
canvas {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
}
</style>



</head>

<body  >
  <!-- using three.js -->
<!-- using ammo.js -->
<canvas id="colorMap"></canvas>
<canvas id="alphaMap"></canvas>

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.145.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/ammo.wasm.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/OrbitControls.145.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/BufferGeometryUtils.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/ConvexHull.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/ConvexGeometry.145.js"></script>
      <script type="module">
let amount = 8;

async function AmmoPhysics() {
  if ("Ammo" in window == !1) return void console.error("AmmoPhysics: Couldn't find Ammo.js");
  let e;
  const t = await Ammo(),o = new t.btDefaultCollisionConfiguration(),n = new t.btCollisionDispatcher(o),a = new t.btDbvtBroadphase(),r = new t.btSequentialImpulseConstraintSolver(),s = new t.btDiscreteDynamicsWorld(n, a, r, o);
  s.setGravity(new t.btVector3(0, -6, 0));
  let i = new t.btTransform();
  const l = new t.btTransform();
  let d,c = new t.btVector3(0, 0, 0),h = new t.btQuaternion(0, 0, 0, 0);
  function E(e) {
    let t = null;
    c.setValue(0, 0, 0);
    let o = e.attributes.position.array;
    t = new Ammo.btConvexHullShape();
    for (let e = 0, n = o.length; e < n; e += 3) {
      c.setValue(o[e], o[e + 1], o[e + 2]);
      const a = e >= n - 3;
      t.addPoint(c, a);
    }
    return t && t.setMargin(0), t || console.error("AmmoPhysics: Shape error."), t;
  }
  let w = [],u = new WeakMap();
  let p = null,m = "";
  function f(e, o, n) {
    d = e.position, h = e.quaternion, i.setIdentity(), c.setValue(d.x, d.y, d.z), i.setOrigin(c),
    i.setRotation(new t.btQuaternion(h.x, h.y, h.z, h.w));
    const a = e.scale;
    c.setValue(a.x, a.y, a.z), n.setLocalScaling(c), c.setValue(0, 0, 0);
    const r = new t.btDefaultMotionState(i),l = c;
    o > 0 && n.calculateLocalInertia(o, l);
    const E = new t.btRigidBodyConstructionInfo(o, r, n, l),p = new t.btRigidBody(E);
    p.setFriction(.2), p.setRestitution(.5), p.setDamping(0, .8), s.addRigidBody(p),
    o > 0 && (w.push(e), u.set(e, p));
  }
  let R = 0;
  const T = -.5;
  return setInterval(function () {
    const t = performance.now();
    if (R > 0) {
      const e = (t - R) / 1e3;
      s.stepSimulation(e, 10);
    }
    R = t;
    for (let t = 0, o = w.length; t < o; t++) {
      if (!w[t]) continue;
      let o = w[t];
      if (o.isInstancedMesh) {
        let t = o.instanceMatrix.array;
        if (!u.has(o)) continue;
        let n = u.get(o);
        for (let o = 0; o < n.length; o++) if (n[o]) {
          if (n[o].getMotionState().getWorldTransform(l), (d = l.getOrigin()).y() < T) {
            let t = THREE.MathUtils.randFloat(-e / 2, e / 2),a = 10,r = THREE.MathUtils.randFloat(-e / 2, e / 2);
            c.setValue(t, a, r), l.setIdentity(), l.setOrigin(c), n[o].setWorldTransform(l),
            c.setValue(0, 0, 0), n[o].setLinearVelocity(c), n[o].setAngularVelocity(c), n[o].clearForces(),
            d.x(t), d.y(a), d.z(r), h.setValue(0, 0, 0, 0);
          } else h = l.getRotation();
          compose(d, h, t, 16 * o);
        }
        u.set(o, n), o.instanceMatrix.needsUpdate = !0;
      } else if (o.isMesh) {
        if (!u.has(o)) continue;
        const t = u.get(o);
        if (t.getMotionState().getWorldTransform(l), (d = l.getOrigin()).y() < T) {
          let n = THREE.MathUtils.randFloat(-e / 2, e / 2),a = 10,r = THREE.MathUtils.randFloat(-e / 2, e / 2);
          c.setValue(n, a, r), l.setIdentity(), l.setOrigin(c), t.setWorldTransform(l), c.setValue(0, 0, 0),
          t.setLinearVelocity(c), t.setAngularVelocity(c), t.clearForces(), h.setValue(0, 0, 0, 0),
          o.position.set(n, a, r);
        } else h = l.getRotation(), o.position.set(d.x(), d.y(), d.z());
        o.quaternion.set(h.x(), h.y(), h.z(), h.w());
      }
    }
  }, 1e3 / 60), {
    addMesh: function (e, t = 0) {
      const o = E(e.geometry);
      if (!o) return console.error("AmmoPhysics: Shape is NULL."), !1;
      f(e, t, o);
    },
    addCompoundMesh: function (e, o = 0, n = []) {
      let a = new t.btCompoundShape();
      for (let e = 0; e < n.length; e++) {
        let t = E(n[e]);
        if (!t) return console.error("AmmoPhysics: Shape is NULL."), !1;
        c.setValue(0, 0, 0), i.setIdentity(), i.setOrigin(c), a.addChildShape(i, t);
      }
      f(e, o, a);
    },
    addParticleMesh: function (e, o = 0) {
      if ((!e.name || e.name && e.name != m) && (p = E(e.geometry), m = e.name), !p) return console.error("AmmoPhysics: Shape is NULL."),
      !1;
      e.isInstancedMesh ? function (e, o, n) {
        let a,r = e.instanceMatrix.array,l = [];
        c.setValue(0, 0, 0);
        for (let d = 0; d < e.count; d++) {
          let e = 16 * d;
          i.setFromOpenGLMatrix(r.slice(e, e + 16));
          let h = new t.btDefaultMotionState(i),E = c;
          n.calculateLocalInertia(o, E);
          let w = new t.btRigidBodyConstructionInfo(o, h, n, E);
          (a = new t.btRigidBody(w)).setFriction(.3), a.setRestitution(.3), a.setDamping(.2, .8),
          s.addRigidBody(a), l.push(a);
        }
        o > 0 && (w.push(e), u.set(e, l));
      }(e, o, p) : e.isMesh && f(e, o, p);
    },
    init: function (t = 10) {
      e = t;
    } };

}

function compose(e, t, o, n) {
  const a = t.x(),r = t.y(),s = t.z(),i = t.w(),l = a + a,d = r + r,c = s + s,h = a * l,E = a * d,w = a * c,u = r * d,p = r * c,m = s * c,f = i * l,R = i * d,T = i * c;
  o[n + 0] = 1 - (u + m), o[n + 1] = E + T, o[n + 2] = w - R, o[n + 3] = 0, o[n + 4] = E - T,
  o[n + 5] = 1 - (h + m), o[n + 6] = p + f, o[n + 7] = 0, o[n + 8] = w + R, o[n + 9] = p - f,
  o[n + 10] = 1 - (h + u), o[n + 11] = 0, o[n + 12] = e.x(), o[n + 13] = e.y(), o[n + 14] = e.z(),
  o[n + 15] = 1;
}

!function () {
  "use strict";
  let e,t,o,n,a,r,s,i,l,d = [];
  const c = 7,h = window.innerWidth < window.innerHeight;
  function E() {
    e.aspect = window.innerWidth / window.innerHeight, e.updateProjectionMatrix(), o.setSize(window.innerWidth, window.innerHeight);
  }
  function w() {
    requestAnimationFrame(w), n.update(), o.render(t, e);
  }
  !async function () {
    (a = await AmmoPhysics()).init(c);
    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),
    e = new THREE.PerspectiveCamera(40, window.innerWidth / window.innerHeight, .01, 500),
    h ? e.position.set(0, 5, 13) : e.position.set(0, 2.5, 8);
    e.lookAt(0, 0, 0);
    const p = new THREE.HemisphereLight(16777215, 0, .3);
    t.add(p);
    const m = new THREE.SpotLight(16777215, 1.5, 18, Math.PI / 8, 1, .5);
    m.position.set(0, 10, 5), m.target.position.set(0, 0, 0), m.target.updateMatrixWorld(),
    m.castShadow = !0, t.add(m);
    new THREE.SpotLightHelper(m);
    let f = new THREE.Mesh(new THREE.SphereGeometry(50, 4, 4), new THREE.MeshBasicMaterial({
      color: "#0f1a1a",
      side: THREE.BackSide }));

    t.add(f), d = [], s = new THREE.MeshLambertMaterial({
      color: "forestgreen" }),
    (r = new THREE.CylinderGeometry(1, 1.7, 1, 6)).translate(0, 1.5, 0), d.push(r),
    (r = new THREE.CylinderGeometry(.7, 1.5, 1, 6)).translate(0, 2.5, 0), d.push(r),
    (r = new THREE.CylinderGeometry(0, 1.2, 2, 6)).translate(0, 4, 0), d.push(r), r = THREE.BufferGeometryUtils.mergeBufferGeometries(d);
    const R = new THREE.Mesh(r, s);
    R.castShadow = !0, R.r.........完整代码请登录后点击上方下载按钮下载查看