let video;

let detections = [];

let personCount = 0;

let eyes = []; // Array zum Speichern der Augenpositionen und -größen

​

function modelReady() {

  console.log('Model is ready!!!');

  mobilenet.detect(gotResults);

}

​

function gotResults(error, results) {

  if (error) {

    console.error(error);

  } else {

    detections = results;

    mobilenet.detect(gotResults);

  }

}

​

function setup() {

  createCanvas(800, 600);

  video = createCapture(VIDEO);

  video.size(800, 600);

  video.hide();

  mobilenet = ml5.objectDetector('cocossd', video, modelReady);

}

​

function draw() {

  background(220);

​

  // Zeichne das Video und erkenne Personen

  image(video, 0, 0);

  let currentPersonCount = 0;

  eyes = [];

​

  if (detections) {

    for (let i = 0; i < detections.length; i++) {

      let object = detections[i];

      if (object.label === 'person') {

        let x = object.x + object.width / 2; // Mitte des Rechtecks

        let y = object.y + object.height / 2; // Mitte des Rechtecks

        let diameter = min(object.width, object.height) / 2; // Durchmesser basierend auf der kleineren Seite des Rechtecks

        eyes.push({ x: x, y: y, diameter: diameter });

​

        noFill();

        stroke(255, 0, 0);

        strokeWeight(2);

        rect(object.x, object.y, object.width, object.height);

​

        currentPersonCount++;

      }

    }

    fill(255);

    textSize(20);

    text('Anzahl der Personen: ' + currentPersonCount, 10, 30);

  } else {

    fill(255);

    textSize(32);

    textAlign(CENTER, CENTER);

    text('Lade...', width / 2, height / 2);

  }

​

  // Zeichne die Augen an den Positionen der erkannten Personen

  drawEyes();

}

​

function drawEyes() {

  for (let i = 0; i < eyes.length; i++) {

    let eye = eyes[i];

​

    // Zeichne den äußeren schwarzen Kreis

    fill(0);

    noStroke();

    let fixedX = width / 2;  // Feste Position in der Mitte des Canvas

    let fixedY = height / 2; // Feste Position in der Mitte des Canvas

    ellipse(fixedX, fixedY, eye.diameter, eye.diameter);

​

    // Berechne die Position des inneren weißen Kreises basierend auf der Position der Person

    let innerDiameter = eye.diameter / 2;

    let maxOffset = (eye.diameter - innerDiameter) / 2;

​

    // Berechne den Abstand zwischen dem Mittelpunkt des schwarzen Kreises und der Position der Person

    let distFromCenter = dist(eye.x, eye.y, fixedX, fixedY);

​

    // Setze den weißen Kreis innerhalb des schwarzen Kreises basierend auf der Position der Person

    let angle = atan2(eye.y - fixedY, eye.x - fixedX);

    let whiteX = fixedX + cos(angle) * maxOffset;

    let whiteY = fixedY + sin(angle) * maxOffset;

​

    fill(255);

    ellipse(whiteX, whiteY, innerDiameter, innerDiameter);

​

    // Berechne die Position des inneren blauen Kreises basierend auf der Position des weißen Kreises

    let blueDiameter = innerDiameter * 0.7; // Der Durchmesser des blauen Kreises ist 70% des Durchmessers des weißen Kreises

    let blueMaxOffset = (innerDiameter - blueDiameter) / 2;

​

    let blueOffsetX = constrain(whiteX - fixedX, -blueMaxOffset, blueMaxOffset);

    let blueOffsetY = constrain(whiteY - fixedY, -blueMaxOffset, blueMaxOffset);

​

    fill(0, 0, 255);

    ellipse(whiteX + blueOffsetX, whiteY + blueOffsetY, blueDiameter, blueDiameter);

  }

}

​