立方体内粒子运动效果-html代码-BFW代码库

立方体内粒子运动效果

代码语言：html

所属分类：三维

代码描述：立方体内粒子运动效果

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
*{
    margin: 0;
    padding: 0;
}

html,body{
    overflow: hidden;
}
</style>

</head>
<body translate="no">
<div id="webgl"></div>

<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/three.110.js"></script>
<script src="http://repo.bfw.wiki/bfwrepo/js/OrbitControls.js"></script>
<script id="rendered-js">
class Camera {
  constructor() {
    this.fovy = 60;
    this.aspect = window.innerWidth / window.innerHeight;
    this.near = .1;
    this.far = 30;
    this.x = 0;
    this.y = 4;
    this.z = 8;
    this.lookAt = new THREE.Vector3(0, 0, 0);
  }}


class PointLight {
  constructor() {
    this.color = 0xffffff;
    this.intensity = 1;
    this.x = 5;
    this.y = 5;
    this.z = 10;
  }}


class AmbientLight {
  constructor() {
    this.color = 0xffffff;
    this.intensity = .2;
  }}


class Material {
  constructor() {
    this.color = 0xffffff;
    this.color02 = 0x74afcb;
    this.color03 = 0x1579c1;
  }}


class Renderer {
  constructor() {
    this.clearcolor = 0x2a3a42; // 背景をクリアする色
    this.width = window.innerWidth;
    this.height = window.innerHeight;
  }}


class Scene {
  constructor() {
    this.fogColor = 0x000000; // フォグの色
    this.fogNear = 10.0; // フォグの掛かり始めるカメラからの距離
    this.fogFar = 50.0; // フォグが完全に掛かるカメラからの距離
  }}
;

//無名関数で全体を囲んで外部から参照されないようにする。
(() => {
  //ページが読み込まれたとき
  window.addEventListener('load', () => {
    init();

    // リサイズイベントの定義
    window.addEventListener('resize', () => {
      renderer.setSize(window.innerWidth, window.innerHeight);
      camera.aspect = window.innerWidth / window.innerHeight;
      camera.updateProjectionMatrix();
    }, false);

    render();
  });

  //各種変数を作成
  let width = window.innerWidth,
  height = window.innerHeight,
  wrapper,
  scene,sceneparam,
  camera,cameraparam,
  renderer,rendererparam,
  boxwiregeometry,boxwiregeometry02,edges,edges02,boxgeometry,boxgeometry02,spheregeometry,
  boxmesh,boxmesh02,boxwireframe,boxwireframe02,spheremesh,spheremeshArray = [],
  boxwirematerial,materialparam,boxmaterial,boxmaterial02,spherematerial,ball,
  pointLight,pointlightparam,ambientLight,ambientlightparam,
  axesHelper,controls,group,
  scalar,scalarArray = [],velocity,angle;

  //各種インスタンスを作成
  sceneparam = new Scene();
  rende.........完整代码请登录后点击上方下载按钮下载查看