JSFiddle - React, Tailwind, and code Playground

JavaScript

ArrayList<Relatives> points;
PImage worldmap; 
void setup() {
  size(1427, 628);
  worldmap = loadImage("worldmap.jpg");
  noStroke();
  smooth();
  points = new ArrayList<Relatives>();
  String a = ("Ft. Collins, CO. 4th gen: brother, me");
  String b = ("Burbank, CA. 3rd gen: father");
  String c = ("St Louis, MO. 2nd gen: grandma(ms)");
  String d = ("Miami, FL. 3rd gen: mother, uncle x 2");
  String e = ("Cincinatti, OH. 1st gen: great-grandma (ms)");
  String f = ("NYC, New York. 1st & 2nd gen: grandpa and great-grandma (ms)");
  String g = ("Ketchican, AK. 3rd gen: uncle (fs)");
  String h = ("Marshall, AR. 3rd gen: grandpa (fs)");
  String i = ("Sandy, Bedfordshire, England. 1st - 3rd gen: great-grandma, grandma, uncle (fs)");
  String j = ("Unknown, Russia. 4th gen: great-grandpa x 2 (ms)");

  
  
  points.add(new Relatives(235,181, a));
  points.add(new Relatives(175,208, b));
  points.add(new Relatives(293,193, c));
  points.add(new Relatives(317,243, d));
  points.add(new Relatives(318,183, e));
  points.add(new Relatives(361,175, f));
  points.add(new Relatives(191,103, g));
  points.add(new Relatives(309,197, h));
  points.add(new Relatives(643,125, i));
  points.add(new Relatives(774,111, j));

}
 
void draw() {
background(worldmap);
  for (Relatives ic : points) {
    ic.update();
    ic.display();
  }
}


class Relatives {
  int x, y, transparency;
  String text;
 
  Relatives(int x, int y, String text) {
    this.x = x;
    this.y = y;
    this.text = text;
  }
 
  void update() {
    if (dist(mouseX, mouseY, x, y) < 15 && transparency < 255) {
      transparency += 7;
    } else if (transparency > 0) {
      transparency -= 3;
    }
  }
 
 void display() {
    fill(0);
    ellipse(x, y, 10, 10);
    fill(0, transparency);
    text(text, x - 50, y - 20);
   
  } 
}