Skip to content

Instantly share code, notes, and snippets.

@64lines
Last active October 21, 2015 18:29
Show Gist options
  • Select an option

  • Save 64lines/106a33913b368c584ce3 to your computer and use it in GitHub Desktop.

Select an option

Save 64lines/106a33913b368c584ce3 to your computer and use it in GitHub Desktop.
Algorithmic Art - Senoidal Wave
<html>
<head>
</head>
<body>
<canvas id="object-canvas" width="1920" height="1080">
<script>
function randomNumber(start, end) {
return Math.floor((Math.random() * end) + start)
}
function paint() {
var canvas = document.getElementById("object-canvas");
var context = canvas.getContext("2d");
var style = "";
style = "rgb(999, 999, 999)";
context.fillStyle = style;
context.fillRect(0, 0, 1920, 1080);
var x = 300;
var y = 300;
var r = 0;
var g = 0
var b = 0;
var size = 1;
var inc = 1;
var limit = 1920
var t = 200; // Period of oscilation of the wave
var a = 20; // Amplitude of the wave
for (var j = -100; j < 2000; j+=2.5) {
// Senesoidal wave
r = randomNumber(0, 222);
g = randomNumber(0, 222);
b = randomNumber(0, 222);
for (var i = 0; i < limit; i += 1) {
x = i;
y = a * Math.sin((2 * Math.PI / t) * x) + j;
context.fillStyle = "rgb(" + r + ", " + g + ", " + b + ")";
context.fillRect(x, y, size, size);
}
}
}
paint();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment