codepens/gradient-ball-sketch/dist/script.js

35 lines
816 B
JavaScript

// Created by Tiffany Rayside: https://codepen.io/tmrDevelops/pen/vOPZBv
var c = document.getElementById('gradient');
var $ = c.getContext('2d');
var col = function(x, y, r, g, b) {
$.fillStyle = "rgb(" + r + "," + g + "," + b + ")";
$.fillRect(x, y, 1,1);
}
var R = function(x, y, t) {
return( Math.floor(192 + 64*Math.cos( (x*x-y*y)/300 + t )) );
}
var G = function(x, y, t) {
return( Math.floor(192 + 64*Math.sin( (x*x*Math.cos(t/4)+y*y*Math.sin(t/3))/300 ) ) );
}
var B = function(x, y, t) {
return( Math.floor(192 + 64*Math.sin( 5*Math.sin(t/9) + ((x-100)*(x-100)+(y-100)*(y-100))/1100) ));
}
var t = 0;
var run = function() {
for(x=0;x<=35;x++) {
for(y=0;y<=35;y++) {
col(x, y, R(x,y,t), G(x,y,t), B(x,y,t));
}
}
t = t + 0.06;
window.requestAnimationFrame(run);
}
run();