Circle_Square_skewed

squares and circles with skewed squares

Log in to post a comment.

Canvas.setpenopacity(1);

const turtle = new Turtle();
turtle.penup();

// Adjustable variables
const gridSize = 3; // min=1 max=10 step=1, Number of rows and columns
const cellSize = 50; // min=10 max=200 step=10, Size of each cell in the grid
const circleSteps = 10; // min=1 max=20 step=1, Number of concentric steps for circles
const squareSteps = 18; // min=1 max=20 step=1, Number of concentric steps for squares
const shapeType = 2; // min=0 max=2 step=1, (Circles, Squares, Both), Type of shapes to draw
const randomness = 0.5; // min=0 max=1 step=0.01, Randomness factor for skewing
const skewAmount = 2; // min=1 max=10 step=1, Amount of skew in pixels

const circleStepSize = cellSize / (2 * circleSteps); // Size of each step for circles
const squareStepSize = cellSize / (2 * squareSteps); // Size of each step for squares

// Function to draw concentric circles
function drawConcentricCircles(x, y, steps, stepSize) {
    for (let i = 0; i < steps; i++) {
        turtle.penup();
        turtle.goto(x, y - stepSize * i);
        turtle.pendown();
        turtle.circle(stepSize * i);
    }
}

// Function to draw concentric squares with skew
function drawConcentricSquares(x, y, steps, stepSize, randomness, skewAmount) {
    for (let i = 0; i < steps; i++) {
        turtle.penup();
        const skewX = (Math.random() * 2 - 1) * randomness * skewAmount;
        const skewY = (Math.random() * 2 - 1) * randomness * skewAmount;
        turtle.goto(x - stepSize * i + skewX, y - stepSize * i + skewY);
        turtle.pendown();
        for (let j = 0; j < 4; j++) {
            turtle.forward(2 * stepSize * i);
            turtle.right(90);
        }
    }
}

// Function to draw concentric shapes based on selected type
function drawConcentricShapes(x, y, circleSteps, circleStepSize, squareSteps, squareStepSize, shapeType, randomness, skewAmount) {
    if (shapeType === 0 || shapeType === 2) {
        drawConcentricCircles(x, y, circleSteps, circleStepSize);
    }
    if (shapeType === 1 || shapeType === 2) {
        drawConcentricSquares(x, y, squareSteps, squareStepSize, randomness, skewAmount);
    }
}

// Draw the grid
for (let row = 0; row < gridSize; row++) {
    for (let col = 0; col < gridSize; col++) {
        const x = -gridSize * cellSize / 2 + col * cellSize + cellSize / 2;
        const y = gridSize * cellSize / 2 - row * cellSize - cellSize / 2;
        drawConcentricShapes(x, y, circleSteps, circleStepSize, squareSteps, squareStepSize, shapeType, randomness, skewAmount);
    }
}