let colorFill = 0;

​

let unique;

​

function setup() {

  createCanvas(400, 400);

  const names = [{

    name: 'John',

    number: 1

  }, {

    name: 'John',

    number: 2

  }, {

    name: 'Paul',

    number: 3

  }, {

    name: 'George',

    number: 4

  }, {

    name: 'Ringo',

    number: 5

  }, {

    name: 'John',

    number: 1

  }, {

    name: 'Ringo',

    number: 5

  }];

​

​

  //create an array with all the names 

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

​

    namesall.push(names[i].name);

​

    unique = [...new Set(namesall)];

    console.log(unique); // 'John', 'Paul', 'George', 'Ringo'

​

  }

​

​

}

​

function draw() {

  background(220);

​

​

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

    if (unique[i].length > 4) {

      colorFill = 255;

    } else {

​

      colorFill = 0;

    }

​

    fill(colorFill);

​

    text(unique[i], 20, 20 + height / 6 * i);

​

  }

​

​

}

​

​

​

//create color for assigned element in the array