Scanline Polygon Fill - Processing

Lista scripturi Script Nou Ajutor
ID	Autor	Duplicat din	Ultima modificare
`#7267`	7B-Necsulescu Stefan Matei (Stefan_Matei_Necsulescu)	-	Luni, 25 mai 2026, 20:46
// Definim cele 3 vârfuri ale triunghiului
let A, B, C;
let activeVertex = null;

function setup() {
  createCanvas(600, 400);
  
  // Pozițiile inițiale ale vârfurilor
  A = createVector(300, 50);
  B = createVector(150, 320);
  C = createVector(480, 280);
}

function draw() {
  background(20, 22, 26);
  
  // 1. Desenăm instrucțiunile
  fill(255, 200);
  noStroke();
  textSize(14);
  text("Trage de vârfurile A, B sau C pentru a modifica triunghiul", 20, 30);
  text("Liniile verzi sunt generate prin scanare orizontală (Scanline)", 20, 50);
  
  // 2. EXECUTĂM ALGORITMUL SCANLINE
  // Găsim limitele verticale ale triunghiului (Y min și Y max)
  let yMin = min(A.y, min(B.y, C.y));
  let yMax = max(A.y, max(B.y, C.y));
  
  // Scanăm de sus în jos, linie cu linie
  for (let scanY = ceil(yMin); scanY <= floor(yMax); scanY++) {
    let intersections = [];
    
    // Verificăm intersecția cu fiecare dintre cele 3 laturi
    checkEdgeIntersection(A, B, scanY, intersections);
    checkEdgeIntersection(B, C, scanY, intersections);
    checkEdgeIntersection(C, A, scanY, intersections);
    
    // Dacă avem două puncte de intersecție valide, umplem spațiul dintre ele
    if (intersections.length >= 2) {
      // Sortăm intersecțiile de la stânga la dreapta (pe axa X)
      intersections.sort((a, b) => a - b);
      
      // Desenăm linia orizontală de umplere (Felia de rasterizare)
      stroke(0, 255, 120, 100); // Verde translucid
      strokeWeight(1);
      line(intersections[0], scanY, intersections[1], scanY);
      
      // Efect vizual: Evidențiem linia curentă de scanare care se mișcă în timp
      if (scanY === floor((frameCount * 2) % (yMax - yMin) + yMin)) {
        // Linia roșie de scanare
        stroke(255, 50, 50);
        strokeWeight(2);
        line(0, scanY, width, scanY);
        
        // Punctele galbene de intersecție calculate de algoritm
        fill(255, 255, 0);
        noStroke();
        ellipse(intersections[0], scanY, 6);
        ellipse(intersections[1], scanY, 6);
      }
    }
  }
  
  // 3. DESENĂM VÂRFURILE ȘI ETICHETELE
  drawVertex(A, "A");
  drawVertex(B, "B");
  drawVertex(C, "C");
}

// Funcție matematică care calculează intersecția unei linii orizontale (scanY) cu o latură (P1-P2)
function checkEdgeIntersection(p1, p2, scanY, list) {
  // Verificăm dacă linia orizontală trece printre cele două puncte pe verticală
  if ((p1.y <= scanY && p2.y > scanY) || (p2.y <= scanY && p1.y > scanY)) {
    // Interpolare liniară pentru a găsi coordonata X a intersecției
    // Formula derivată din ecuația dreptei: X = X1 + (scanY - Y1) / m
    let t = (scanY - p1.y) / (p2.y - p1.y);
    let intersectX = p1.x + t * (p2.x - p1.x);
    list.push(intersectX);
  }
}

// Funcție ajutătoare pentru a desena și manipula vârfurile
function drawVertex(v, label) {
  stroke(255);
  strokeWeight(2);
  fill(40, 90, 235);
  ellipse(v.x, v.y, 16);
  
  fill(255);
  noStroke();
  textAlign(CENTER, CENTER);
  text(label, v.x, v.y - 18);
}

// Interacțiunea cu mouse-ul pentru mutarea vârfurilor
function mousePressed() {
  let m = createVector(mouseX, mouseY);
  if (v.dist(m, A) < 15) activeVertex = A;
  else if (v.dist(m, B) < 15) activeVertex = B;
  else if (v.dist(m, C) < 15) activeVertex = C;
}

function mouseDragged() {
  if (activeVertex) {
    activeVertex.x = constrain(mouseX, 10, width - 10);
    activeVertex.y = constrain(mouseY, 10, height - 10);
  }
}

function mouseReleased() {
  activeVertex = null;
}

// Truc pentru p5.js instanțiat ca să evite coliziunea de nume la distanță statică
const v = { dist: (p1, p2) => Math.sqrt((p1.x - p2.x)**2 + (p1.y - p2.y)**2) };
Du-te sus!