随机波浪波纹动画效果-html代码-BFW代码库

随机波浪波纹动画效果

代码语言：html

所属分类：背景

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

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

<style>
body {
  margin: 0;
}
canvas {
  display: block;
}
</style>

</head>
<body translate="no">
<canvas id="canvas"></canvas>
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/three.109.js"></script>
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/chroma.min.js"></script>
<script >
function App() {
  const conf = {
    nx: 40,
    ny: 100,
    cscale: chroma.scale(['#2175D8', '#DC5DCE', '#CC223D', '#F07414', '#FDEE61', '#74C425']).mode('lch'),
    darken: -1,
    angle: Math.PI / 3,
    timeCoef: 0.1 };


  let renderer, scene, camera;
  let width, height;
  const { randFloat: rnd } = THREE.Math;

  const uTime = { value: 0 },uTimeCoef = { value: conf.timeCoef };
  const polylines = [];

  init();

  function init() {
    renderer = new THREE.WebGLRenderer({ canvas: document.getElementById('canvas'), antialias: true });
    camera = new THREE.PerspectiveCamera();

    updateSize();
    window.addEventListener('resize', updateSize, false);
    document.body.addEventListener('click', initRandomScene);

    ini.........完整代码请登录后点击上方下载按钮下载查看