​

let canvasWidth = 450;

let drawingHeight = 450;

let controlRegionHeight = 60;

let canvasHeight = drawingHeight + controlRegionHeight;

let xCenter = canvasWidth / 2;

let yCenter = drawingHeight / 2;

let nSlider, degreeSlider;

let leftMargin = 100;

​

// Arrays to store node positions and connections

let nodes = [];

let connections = [];

​

var numNodes = 10;

var oldNumNodes = 9;

var degree = 2;

var oldDegree = 1;

​

function setup() {

  createCanvas(canvasWidth, canvasHeight);

  textSize(16);

    // slider to control the number of vertices on the edge of the circle

  nSlider = createSlider(4, 20, 10, 1).position(leftMargin, canvasWidth + 10);

  nSlider.size(canvasWidth-leftMargin);

  // slider to control the degree of connections

  degreeSlider = createSlider(1, 10, 4, 1).position(leftMargin, canvasWidth + 30);

  degreeSlider.size(canvasWidth-leftMargin);

  // Initialize node positions randomly

  for (let i = 0; i < numNodes; i++) {

      nodes.push(createVector(random(10, canvasWidth-10), random(10, drawingHeight-10)));

  }

  // Create connections based on the degree

    for (let i = 0; i < numNodes; i++) {

      let connectedNodes = [];

      for (let j = 0; j < degree; j++) {

        let randomNode = floor(random(numNodes));

        while (connectedNodes.includes(randomNode) || randomNode === i) {

          randomNode = floor(random(numNodes));

        }

        connectedNodes.push(randomNode);

      }

      connections.push(connectedNodes);

    }

​

}

​

function draw() {

  // get the updates from any changes in the slider values

  numNodes = nSlider.value();

  degree = degreeSlider.value();

​

  //. only redraw on change to slider values

  if ((numNodes != oldNumNodes) || (degree != oldDegree)) {

    // redraw the background

    fill('aliceblue');

    rect(0,0,canvasWidth, drawingHeight);

    fill('white');

    rect(0, drawingHeight, canvasWidth, controlRegionHeight);

​

    // if we have a new node count

    if (numNodes != oldNumNodes) {

      let nodes = [];

      // Initialize node positions randomly

      for (let i = 0; i < numNodes; i++) {

        nodes.push(createVector(random(10, canvasWidth-10), random(10, drawingHeight-10)));

      }

    }

    // redo the connections only if we have a new degree

    if (degree != oldDegree) {

    // Create connections based on the degree

    for (let i = 0; i < numNodes; i++) {

      let connectedNodes = [];

      for (let j = 0; j < degree; j++) {

        let randomNode = floor(random(numNodes));

        while (connectedNodes.includes(randomNode) || randomNode === i) {

          randomNode = floor(random(numNodes));

        }

        connectedNodes.push(randomNode);

      }

      connections.push(connectedNodes);

    }

  }

    // Draw connections

    stroke(0);

    strokeWeight(2);

    for (let i = 0; i < numNodes; i++) {

      for (let j = 0; j < connections[i].length; j++) {

        let connectedNode = connections[i][j];

        line(nodes[i].x, nodes[i].y, nodes[connectedNode].x, nodes[connectedNode].y);

      }

    }

​

    // Draw nodes

    for (let i = 0; i < numNodes; i++) {

      fill('blue');

      circle(nodes[i].x, nodes[i].y, 20);

      noStroke();

      fill('white');

      text(i, nodes[i].x - 5, nodes[i].y + 5);

    }

    noStroke();

    fill('black');

    text('Nodes: ' + numNodes, 10, drawingHeight + 20);

    text('Degree: ' + (degree), 10, drawingHeight + 40);

    // reset the old values

    oldNumNodes = numNodes;

    oldDegree = degree;

​

    }

}