Created
March 23, 2018 17:27
-
-
Save sabha/279f4ae2b462124d2e2f0ff60b3d8607 to your computer and use it in GitHub Desktop.
Mandala
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <body> | |
| <script> | |
| function bootStrapMandala(){ | |
| var name = "canvas"+Math.floor(Math.random() * 1000); | |
| var canv = document.createElement('canvas'); | |
| canv.id = name; | |
| canv.width = 250; | |
| canv.height = 250; | |
| canv.style="border:1px solid #d3d3d3;margin: 4px;"+"background-color: "+"#000033"+";" | |
| document.body.appendChild(canv); | |
| var c = document.getElementById(name); | |
| var ctx = c.getContext("2d"); | |
| var cx = c.width/2; | |
| var cy = c.height/2; | |
| var color = () => { | |
| var letters = '0123456789ABCDEF'; | |
| var color = '#'; | |
| for (var i = 0; i < 6; i++) { | |
| color += letters[Math.floor(Math.random() * 16)]; | |
| } | |
| return color; | |
| } | |
| var circle = (x,y,r, clr) => { | |
| ctx.beginPath(); | |
| ctx.arc(x,y,r,0,2*Math.PI); | |
| ctx.fillStyle = clr; | |
| ctx.fill(); | |
| //ctx.lineWidth = 5; | |
| //ctx.strokeStyle = '#003300'; | |
| //ctx.stroke(); | |
| } | |
| var toDegrees = (angle) => (angle * (180 / Math.PI)); | |
| var toRadians = (angle) => (angle * (Math.PI / 180)); | |
| var mandala = (r,minAngle = 30, cr = 2, clr = color()) => { | |
| for(var a = 0 ; a < 360; a+=minAngle) { | |
| var angle = toRadians(a); | |
| var x = r*Math.cos(angle); | |
| var y = r*Math.sin(angle); | |
| circle(x+cx,y+cy,cr, clr); | |
| } | |
| } | |
| return mandala; | |
| } | |
| var mandala = bootStrapMandala(); | |
| mandala(10); | |
| mandala(3); | |
| mandala(20); | |
| mandala(28, 20, 4); | |
| mandala(50, 40, 8); | |
| mandala(50, 20, 4); | |
| mandala(50, 20, 2); | |
| var mandala = bootStrapMandala(); | |
| mandala(10); | |
| mandala(20); | |
| mandala(28, 20, 4); | |
| mandala(40, 20, 4); | |
| mandala(40, 20, 2); | |
| mandala(50, 20, 2); | |
| mandala(80, 15, 4); | |
| var mandala = bootStrapMandala(); | |
| mandala(10); | |
| mandala(20); | |
| mandala(28, 20, 4); | |
| mandala(40, 20, 4); | |
| mandala(50, 20, 2); | |
| mandala(100, 20, 8); | |
| mandala(100, 20, 5); | |
| mandala(80, 16, 5); | |
| var mandala = bootStrapMandala(); | |
| mandala(10); | |
| mandala(3); | |
| mandala(20); | |
| mandala(28, 20, 4); | |
| mandala(40, 40, 8); | |
| mandala(40, 20, 4); | |
| mandala(40, 20, 2); | |
| </script> | |
| </body> | |
| </html> |
Author
sabha
commented
Mar 23, 2018
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment