three实现三维粒子圆球与圆环旋转动画效果代码-html代码-BFW代码库

three实现三维粒子圆球与圆环旋转动画效果代码

代码语言：html

所属分类：三维

代码描述：three实现三维粒子圆球与圆环旋转动画效果代码

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

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

<head>
  <meta charset="UTF-8">

  
  
<style>
* {
  background-color: #000;
  color: #fff;
}

body {
  overflow: hidden;
}

#canvas {
	width: 100%;
	height: 100%;
  padding: 0;
	margin: 0;
	width: 100%;
	height: 100vh;
  /*
  position:absolute;
  left:0;
  top:0;
  background:transparent;
  z-index: 1;
  */
}
</style>

  
</head>

<body >
  <div id="canvas"></div>

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.154.js"></script>
      <script  >

let scene, camera, renderer;

function degrees_to_radians(degrees) {
  var pi = Math.PI;
  return degrees * (pi / 180);
}

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


  scene.lookAt(0, 0.1, 0);

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


  renderer.setSize(window.innerWidth, window.innerHeight);
  document.getElementById("canvas").appendChild(renderer.domElement);

  const geometryT = new THREE.TorusGeometry(
  9, 1, 10, 36, 2 * Math.PI);


  const geometryS = new THREE.SphereGeometry(
  5, 20, 20);
.........完整代码请登录后点击上方下载按钮下载查看