Gif is very small due to lemmy.ml size restrictions. I can probably put a higher res one on youtube if ppl want to see.

edit: made it reasonable size by changing it to mp4

  • morrowind@lemmy.mlOPM
    link
    fedilink
    arrow-up
    1
    ·
    4 months ago

    sure, if you want. It’s based on a a tutorial by “gorilla sun”. I can link you to that if you prefer, or give you my code to modify directly

      • morrowind@lemmy.mlOPM
        link
        fedilink
        arrow-up
        2
        ·
        4 months ago

        tutorial: https://www.gorillasun.de/blog/making-of-gateway/

        code:

        let N = 18;
        
        
        function setup() {
           w = min(windowWidth, windowHeight);
           createCanvas(w, w);
           strokeWeight(6);
        
           compps = [];
           for (n = 0; n < N; n++) {
              rateOffset = map(n, 0, N, 0, 1);
              compps.push(rateOffset);
           }
           frameRate(20);
        
        }
        
        let div = 6;
        let radius = 100;
        let rmax = 300;
        let compp = 0;
        let rate = 0.033;
        
        function draw() {
           // clear();
           background(255, 0, 0, 40);
           translate(w / 2, w / 2);
        
           for (n = 0; n < N; n++) {
              compps[n] += rate * (round(1 - compps[n], 1) + 0.05);
              if (compps[n] > 1) {
                 compps[n] = 0;
              }
        
              shift = n*TAU / N;
        
              radius = map(compps[n], 0, 1, 0, rmax);
              for (b = shift; b < TAU + shift; b += TAU / div) {
                 let a = b;// * compps[n];
                 x = radius * cos(a);
                 y = radius * sin(a);
                 strokeLength = 20;
                 maxStrokeWeight = 5;
                 maxStrokeLength = 10;
                 minDist = maxStrokeLength * maxStrokeWeight;
                 if (radius < minDist) {
                    dWeight = map(radius, 0, minDist, 0, maxStrokeWeight);
                    strokeWeight(dWeight);
                    strokeLength = dWeight*maxStrokeLength;
                 } else {
                    dWeight = map(radius, minDist, rmax, maxStrokeWeight, 0);
                    strokeWeight(dWeight);
                    strokeLength = dWeight * maxStrokeLength;
                 }
        
                 point(x, y);
        
        
                 vRight = createVector(
                    radius * cos(a + TAU / div),
                    radius * sin(a + TAU / div)
                 );
        
                 angleRight = atan2(vRight.x - x, vRight.y - y);
        
        
                 vecRight = createVector(
                    x + strokeLength * sin(angleRight),
                    y + strokeLength * cos(angleRight)
                 );
        
                 line(x, y, vecRight.x, vecRight.y);
        
                 vLeft = createVector(
                    radius * cos(a - TAU / div),
                    radius * sin(a - TAU / div)
                 );
        
                 angleLeft = atan2(vLeft.x - x, vLeft.y - y);
        
                 vecLeft = createVector(
                    x + strokeLength * sin(angleLeft),
                    y + strokeLength * cos(angleLeft)
                 );
        
                 line(x, y, vecLeft.x, vecLeft.y);
              }
           }
        }