Created
September 11, 2017 15:10
-
-
Save timup/a2523e00a3625dda52f8786036a2b526 to your computer and use it in GitHub Desktop.
trianglify.js generative art implementation
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> | |
| <head> | |
| <title>triangles</title> | |
| </head> | |
| <body> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/trianglify/0.4.0/trianglify.min.js"></script> | |
| <script> | |
| var colors = shuffle(['#599054','#94B569', '#C4D2A5', '#F6EECD']); | |
| var des_colores = shuffle(['#94B569', '#C4D2A5', '#F2D383', '#fff']); | |
| var pattern = Trianglify({ | |
| width: 1000, | |
| height: 500, | |
| x_colors: colors, | |
| y_colors: des_colores, | |
| color_space: 'lab', | |
| variance: 0.75, // default | |
| stroke_width: 1.51 // default | |
| }); | |
| var image = document.createElement("img"); | |
| image.setAttribute('src', pattern.png()); | |
| document.body.appendChild(image); | |
| function shuffle(array) { | |
| let counter = array.length; | |
| // While there are elements in the array | |
| while (counter > 0) { | |
| // Pick a random index | |
| let index = Math.floor(Math.random() * counter); | |
| // Decrease counter by 1 | |
| counter--; | |
| // And swap the last element with it | |
| let temp = array[counter]; | |
| array[counter] = array[index]; | |
| array[index] = temp; | |
| } | |
| return array; | |
| } | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment