p5实现宇宙星体行星运行动画效果代码-html代码-BFW代码库

p5实现宇宙星体行星运行动画效果代码

代码语言：html

所属分类：动画

代码描述：p5实现宇宙星体行星运行动画效果代码

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

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

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


  
  
  
  
<style>
* { margin:0; padding:0; } 
html, body { width:100%; height:100%; overflow: hidden; background:black;} 
canvas { display:block; }
</style>


  
  
</head>

<body translate="no">
  <div id="controls"></div>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/p5-1.9.0.js"></script>
      <script  >

let numArcs = 2000;
let zoomScale = 3;

function setup (){
  createCanvas();
  colorMode(HSB, 1, 1, 1);
  windowResized();
}

let spaceObject = ({col, hue, len, angle, radius, speed, target, isPlanet=false}) => 
                  ({col, hue, len, angle, radius, speed, target, isPlanet});

let rInt = (b, a=0) => floor(random(min(a, b), max(a, b)));

let init = () => {
  window.arcs       = [];
  window.planets    = [];
  window.stars      = [];
  
  window.numCircles = rInt(70, 120);
  window.radius     = min(width, height)*.45;
  window.arcSize    = radius/numCircles;
  window.center     = {x:0, y:0, radius, len:radius/2};
  
  window.baseHue  = random();
  window.hueRange = random(.2, .7)*(random() < .5 ? -1 : 1);
  window.colorMap = (amt, hueShift=0) => [(baseHue+amt*hueRange+hueShift)%1, amt, 1-amt];
  
  let variance = random(.05, .4);
  
  for (let i = 0; i < numArcs; i++){
    let radius = rInt(numCircles);
    let amt    = radius/numCircles + random(-variance, variance);
    amt = constrain.........完整代码请登录后点击上方下载按钮下载查看