Networks

https://youtu.be/lKP8C1pRbiw

In this work I wanted to display how networks of people are created. The program starts off by creating several dots (people), and then randomly joins them together (relations). That is supposed to symbolize how humans form relations. Note that some of the lines change their color with time, as the relationship status changes as well. Even though people are connected randomly, they are capable of creating dense networks. I used the for loop to create the animation of two dots “coming” to each other.

var points = [];
var lines = [];

function setup() {
  createCanvas(800, 800);
  background(220);
  strokeWeight(5);
}

function draw() {
  if(frameCount%100==0){
    addPoint(floor(random(width)), floor(random(height)));
  }
  if(frameCount%50==0){
    addLine();
  }  
  drawLines();
}

function drawLines(){
  for(i=0;i<lines.length;i++){
    l=lines[i];
    initA=l.p1;
    initB=l.p2;
    vx=abs(initA.x-initB.x)/400;
    vy=abs(initA.y-initB.y)/400;
    tmpA=l.tmpA;
    tmpB=l.tmpB;
    
    if(((abs(initA.x-initB.x)/2)-(abs(initA.x-tmpA.x)))>0){
      if(initA.x>initB.x){
        tmpA.x-=vx;
        tmpB.x+=vx;
      }
      else {
        tmpA.x+=vx;
        tmpB.x-=vx;
      }
      if(initA.y>initB.y){
        tmpA.y-=vy;
        tmpB.y+=vy;
      }
      else {
        tmpA.y+=vy;
        tmpB.y-=vy;
      }
      
    stroke(l.c);
    point(tmpA.x, tmpA.y);
    point(tmpB.x, tmpB.y);
    }  
  }
}

function addPoint(x, y){
  p=new Point(x, y);
  points.push(p);
  stroke(p.c);
  point(p.x, p.y);
}

function addLine(){
  if(points.length>2){
    r1=floor(random(points.length-1));
    r2=floor(random(points.length-1));
    while(r1==r2){
      r2=floor(random(points.length-1));
    }
    p1=points[r1];
    p2=points[r2];
    
    l=new Line(p1, p2);
    lines.push(l);
  }
}

function Point(x, y) {
  this.x=x;
  this.y=y;
  this.c="#".concat((floor(random()*16777215)).toString(16));
}

function Line(p1, p2){
  this.p1=p1;
  this.p2=p2;
  this.tmpA= new Point(p1.x, p1.y);
  this.tmpB= new Point(p2.x, p2.y);
  this.c="#".concat((floor(random()*16777215)).toString(16));
}