Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html>
- <head>
- <title>sierpinksi polygons</title>
- </head>
- <body>
- <canvas width="500" height="500" id="canvas"></canvas>
- <script>
- let canavas = document.getElementById("canvas");
- let ctx = canvas.getContext("2d");
- let imgdata = ctx.createImageData(500, 500);
- let data = imgdata.data;
- let vertices = [{x: 0, y: 0}, {x: 500, y: 0}, {x: 250, y: 433}];
- function pixel(x, y) {
- data[4*y*canvas.width+4*x + 3] = 1; //sets alpha to 1 which makes the pixel black
- }
- function random() {
- return vertices[Math.floor(Math.random()*vertices.length)];
- }
- let point = {x: 0, y: 0};
- for (let i = 0; i < 10000; i++) {
- let temp = random();
- //algorithm to draw sierpinksi triangle pixel by pixel
- point.x = point.x + (temp.x - point.x)/2;
- point.y = point.y + (temp.y - point.y)/2;
- pixel(Math.round(point.x), Math.round(point.y));
- }
- console.log(imgdata)
- ctx.putImageData(imgdata, 0, 0);
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement