EN
JavaScript and animated sinus in console
18 points
Hello everyone 🙂
Today I'd like to share with you simple but effective way of using mathematical sinus to make funny animation in console with my favourite JavaScript.
Do you have smarter or better way of doing similar example? Any suggestion is appreciated, thanks in advance. 👍
I hope someone will get inspired by this post and will create something even more creative.
xxxxxxxxxx1
function printSine(x1, x2) {2
var dx = 3.14 / 4.0; // x axis step3
var dy = 1.0 / 5.0; // y axis step4
5
function printLine(character) {6
var line = '';7
8
for(var y = y1; y < y2; y += dy) {9
line += '.';10
}11
12
console.log(line + character);13
}14
15
for (var rad = x1; rad < x2; rad += dx) {16
var y1 = 0.0;17
var y2 = Math.sin(rad) + 1;18
19
printLine('😃');20
}21
}22
23
var x1 = 0.0; // begining of sinus chart24
var x2 = 6 * 3.14 // end of sinus chart25
26
setInterval(function() {27
console.clear();28
printSine(x1, x2);29
30
x1 += 0.3;31
x2 += 0.3;32
33
}, 40);xxxxxxxxxx1
function printSine(x1, x2) {2
var dx = 3.14 / 4.0; // x axis step3
var dy = 1.0 / 5.0; // y axis step4
5
function printLine() {6
var line = '';7
8
for(var i = 0; i < arguments.length; ++i) {9
var character = arguments[i];10
11
for(var y = y1; y < y2; y += dy) {12
line += ' ';13
}14
15
line += character;16
line+= ' ';17
18
for(var y = y2; y < 1.0; y += dy) {19
line += ' ';20
}21
}22
23
console.log(line);24
}25
26
for (var rad = x1; rad < x2; rad += dx) {27
var y1 = 0.0;28
var y2 = Math.sin(rad) + 1;29
30
printLine('😃', '😃');31
}32
}33
34
var x1 = 0.0; // begining of sinus chart35
var x2 = 6 * 3.14 // end of sinus chart36
37
setInterval(function() {38
console.clear();39
printSine(x1, x2);40
41
x1 += 0.3;42
x2 += 0.3;43
44
}, 4);xxxxxxxxxx1
function printSine(x1, x2) {2
var dx = 3.14 / 4.0; // x axis step3
var dy = 1.0 / 5.0; // y axis step4
5
for (var rad = x1; rad < x2; rad += dx) {6
var y1 = 0.0;7
var y2 = Math.sin(rad) + 1;8
9
var line = '';10
11
for(var y = y1; y < y2; y += dy) {12
line += ' ';13
}14
15
console.log(line + '+');16
}17
}18
19
var x1 = 0.0; // begining of sinus chart20
var x2 = 6 * 3.14 // end of sinus chart21
22
setInterval(function() {23
console.clear();24
printSine(x1, x2);25
26
x1 += 0.3;27
x2 += 0.3;28
29
}, 50);xxxxxxxxxx1
function printSine(x1, x2) {2
var dx = 3.14 / 4.0; // x axis step3
var dy = 1.0 / 5.0; // y axis step4
5
function printLine(character) {6
var line = '';7
8
for(var y = y1; y < y2; y += dy) {9
line += ' ';10
}11
12
console.log(line + character);13
}14
15
for (var rad = x1; rad < x2; rad += dx) {16
var y1 = 0.0;17
var y2 = Math.sin(rad) + 1;18
19
printLine('*');20
}21
22
printLine('😃');23
}24
25
var x1 = 0.0; // begining of sinus chart26
var x2 = 6 * 3.14 // end of sinus chart27
28
setInterval(function() {29
console.clear();30
printSine(x1, x2);31
32
x1 += 0.3;33
x2 += 0.3;34
35
}, 50);So, that's all for today, I hope you enjoyed this short post, leave a comment with improvement suggestions or any thoughts.
Thanks, be well and see you soon in my next post. 👍 🙂
