p5实现宇宙星球运转动画效果代码
代码语言:html
所属分类:动画
代码描述:p5实现宇宙星球运转动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/p5.0.10.2.js"></script>
<style>
/*INSPIRED BY Hyper Glu's Going to Quasar.
https://www.behance.net/gallery/45428489/Going-to-Quasar*/
html, body {
height: 100%;
overflow: hidden;
background-color: #000;
}
body {
margin: 0;
display: flex;
/* This centers our sketch horizontally. */
justify-content: center;
/* This centers our sketch vertically. */
align-items: center;
}
</style>
</head>
<body>
<script>
// INSPIRED BY Hyper Glu's Going to Quasar.
// https://www.behance.net/gallery/45428489/Going-to-Quasar
var c1, c2;
var N = 150;
var n = 100;
var t = 80;
var b = 60;
var th = 0;
var back = [];
var middle = [];
var inter = [];
var front = [];
var points = [];
var planet, planet2;
var sz, msz;
var viewport;
function setup() {
var density = displayDensity();
pixelDensity(density);
createCanvas(windowWidth, windowHeight);
c1 = color("#140c35");
c2 = color("#1dada4");
c3 = color("#edf683");
c4 = color("#fcfdef");
viewport = min(windowHeight, windowWidth);
planet = createVector(viewport/4.1, -viewport/5);
sz = viewport/.........完整代码请登录后点击上方下载按钮下载查看
网友评论0