three+gsap实现长满毛发的毛毛球动画效果代码-html代码-BFW代码库

three+gsap实现长满毛发的毛毛球动画效果代码

代码语言：html

所属分类：动画

代码描述：three+gsap实现长满毛发的毛毛球动画效果代码

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

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

<head>

  <meta charset="UTF-8">

<style>
body {
  background: #000;
  overflow: hidden;
  margin: 0;
}
</style>



</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/simplex-noise.min.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/gsap.3.5.2.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/CustomEase3.js"></script>
      <script  >
console.clear();

let palette = [
new THREE.Color("#00ffff"),
new THREE.Color("#ff00ff"),
new THREE.Color("#ffff00"),
new THREE.Color("#ffffff")];


const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(
75,
window.innerWidth / window.innerHeight,
0.1,
1000);


const renderer = new THREE.WebGLRenderer({
  antialias: true });

renderer.setSize(window.innerWidth, window.innerHeight);
if (window.devicePixelRatio > 1.5) {
  renderer.setPixelRatio(2);
}
document.body.appendChild(renderer.domElement);

camera.position.x = 4;
camera.position.y = 0;
camera.position.z = 12;

const linesMaterial = new THREE.LineBasicMaterial({
  color: 0xffffff,
  transparent: true,
  opacity: 0.5,
  blending: THREE.AdditiveBlending,
  vertexColors: true });

const particlesMaterial = new THREE.LineBasicMaterial({
  color: 0xffffff,
  transparent: true,
  blending: THREE.AdditiveBlending,
  vertexColors: true });


const group = new THREE.Group();
scene.add(group);

let points = [];
const linesGeometry = new THREE.BufferGeometry();
const line = new THREE.LineSegments(linesGeometry, linesMaterial);
group.add(line);

class Particle {
  constructor() {
    this.center = new THREE.Vector3().
    random().
    subScalar(0.5).
    multiplyScalar(40);
    this.r = Math.random() * 1 + 0.1;
    this.theta = Math.random() * Math.PI;
    this.phi = Math.random() * Math.PI * 2;
    this.speed = Math.random() * 0.01 * (Math.random() > 0.5 ? 1 : -1);
    let x = this.center.x + this.r * Math.cos(this.theta) * Math.sin(this.phi);
    let y = this.center.y + this.r * Math.sin(this.theta) * Math.sin(this.phi);
    let z = this.center.z + this.r * Math.cos(this.phi);
    thi.........完整代码请登录后点击上方下载按钮下载查看