For this assignment, I wanted to use the array function to draw knitting loops. I saw an image of knitting net that I did for an exhibition a few years ago
Then, I break down the technical drawing of knitting, I wanted to create a pattern of knitting loops that by clicking the mouse each loop will add and create this layout.
I realize that in order for each individual loop to go inside another and create this 3d affect, I will have to break down the loop itself into three different shapes and create a grid for each of them.
By using bezier and curve I succeeded in creating the shape of the loop and then I used the drawGrid function to determine the distance to the shapes.
drawGrid: function() {
for (var x = 0; x <= width; x += 95) {
for (var y = 0; y <= height; y += 50)
shapes.push({
x: x,
y: y,
bezier1: [30, 20, 20, 20, 80, 80, 15, 95],
bezier2: [90, 20, 100, 20, 40, 80, 105, 95],
curve: [50, 100, 90, 20, 30, 20, 50, 100]
});
I used the function mouseClicked to define my array as the shapes that by each click will duplicate the loops, each printCount will add more loops as to the number I will determine, knitting actually works as one loop at the time so maybe = 1 is more accurate. The movement of the loops as lines is like the line you produce when you knit with the needles.
Comments