three+webgl实现太阳内核耀斑闪耀三维效果代码-html代码-BFW代码库

three+webgl实现太阳内核耀斑闪耀三维效果代码

代码语言：html

所属分类：三维

代码描述：three+webgl实现太阳内核耀斑闪耀三维效果代码

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

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

<head>

  <meta charset="UTF-8">

  
  
  
<style>
canvas {
	position: fixed;
	top: 0;
	left: 0;
}
html,
body {
	background-color: black;
}
</style>



</head>

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

      <script  type="module">

class App {
  constructor() {
    this.toUpdate = [];
    this.camera = new THREE.PerspectiveCamera(
      45,
      innerWidth / innerHeight,
      0.1,
      100.0
    );
    this.camera.position.set(2, 1.5, 2);
    this.camera.lookAt(new THREE.Vector3());
    this.initRenderer();

    // this.controls = new OrbitControls(this.camera, this.renderer.domElement);
    // this.controls.target = new THREE.Vector3(0, 0, 0);
    // this.toUpdate.push(this.controls);

    this.scene = new THREE.Scene();

    this.name = "Sunshine";
    this.version = 1;
    this.initSun();
  }

  gradient() {
    var c = document.createElement("canvas");
    var g = c.getContext("2d");
    c.width = 64;
    c.height = 4;
    var grad = g.createLinearGradient(0, 0, 64, 0);
    grad.addColorStop(0, "white");
    grad.addColorStop(0.16, "#FEF28C");
    grad.addColorStop(0.39, "#FFDE69");
    grad.addColorStop(0.59, "#E36700");
    grad.addColorStop(0.78, "#5C2200");
    grad.addColorStop(1, "black");
    g.fillStyle = grad;
    g.fillRect(0, 0, 64, 4);
    return c;
  }

  initSun() {
    this.sun = new THREE.Mesh(
      new THREE.SphereGeometry(1, 40, 40),
      this.sunShader()
    );

    var corona = new THREE.Mesh(
      new THREE.CylinderGeometry(2.4, 1.0, 0.01, 32, 1, true),
      this.coronaShader()
    );
    corona.........完整代码请登录后点击上方下载按钮下载查看