Log in to post a comment.

// a rewrite of @makio135 observable svg artwork
// https://observablehq.com/@makio135/rotated-arcs

const center = 10; // min=1,max=25,step=1
const spacing = 1; // min=1,max=3,step=0.25

var iterations = 200
var with_frame = false

// You can find the Turtle API reference here: https://turtletoy.net/syntax
Canvas.setpenopacity(1);

// Global code will be evaluated once.
const turtle = new Turtle();
turtle.degrees();
turtle.penup();
turtle.goto(0,0);
turtle.pendown();

// The walk function will be called until it returns false.
function walk(i) {
    if (with_frame && i==0) {
        // frame
        turtle.jump(-100,-100)
        turtle.goto(-100,100)
        turtle.goto(100,100)
        turtle.goto(100,-100)
        turtle.goto(-100,-100)
    }
    let radius = center+spacing*i
    drawCircle(radius)
    return i < iterations;
}

function drawCircle(radius) {
    let start_angle = Math.ceil(randomIn(0,360))
    let draw_angle = Math.ceil(randomIn(0,360))
    let start = {
        x: Math.cos(start_angle*Math.PI/180)*radius,
        y: Math.sin(start_angle*Math.PI/180)*radius
    }
    turtle.jump(start.x, start.y)
    for (i=start_angle; i<=start_angle+draw_angle; i+=1) {
        let x = Math.cos(i*Math.PI/180)*radius
        let y = Math.sin(i*Math.PI/180)*radius
        turtle.goto(x,y)
    }
}

// utilities
function randomIn(min, max) {
  return Math.random() * (max - min) + min;
}

function map(number, inMin, inMax, outMin, outMax) {
    return (number - inMin) * (outMax - outMin) / (inMax - inMin) + outMin;
}