let starCount;

let starColor;

let starTemperature;

let starType;

let starRadius;

let starList = [];

let starTypeList = ["Red Dwarf", "Brown Dwarf", "White Dwarf", "Main Sequence" , "SuperGiants", "HyperGiants"]

let newStar;

​

​

function preload(){

  stars = loadTable("stars.csv","csv","header");

}

​

function setup() {

  colorMode(HSB,360,100,100,100);

  createCanvas(500, 400);

  starCount = stars.getRowCount(stars);

  starColor = stars.getColumn("Star color");

  starTemperature = stars.getColumn("Temperature (K)")

  starType = stars.getColumn("Star type");

  starRadius = stars.getColumn("Radius(R/Ro)");

  //choosing random 20 stars in the csv file

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

    newStar = int(random(0,starCount));

    while (newStar in starList){

      newStar = int(random(0,starCount));//generate a new star if the star is already in the list

    }

    starList.push(new star(starType[newStar],starColor[newStar],starTemperature[newStar])); // add to array

  }

}

​

function draw() {

  background(240,100,19.6);

  textFont("Courier New");

  fill("white");

  text("Stars in the Universe", 20,350);

  //display all stars in the list

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

    starList[i].display();

  }

}

​

class star{

  constructor(type, color, temperature){

    this.x = int(random(20,400));

    this.y = int(random(20,400));

    this.type = starTypeList[type];

    //associate colors in the csv file with a color code

    if(color == "Red"){

      this.color = [0,92,90];

    }else if(color == "Blue"){

      this.color = [199,96,89];

    }else if(color == "White"){

      this.color = [0,0,100];

    }else{

      this.color = [45,64,100];

    }

​

    this.temperature = int(temperature);

    this.radius = random(10,30);

  }

  display(){

    //calculate how close the mouse is to the star

    let distance = ((mouseX - this.x)**2 + (mouseY-this.y)**2)**0.5

    noStroke();

    drawingContext.shadowBlur = 32;

    drawingContext.shadowColor = color(this.color);

    fill(this.color);

    circle(this.x,this.y,this.radius);

    //display information box if the cursor is hovering

    drawingContext.shadowBlur = 0;

    if (distance < this.radius){

      fill("white");

      rect(this.x,this.y - 10,180,30);

      fill("black");

      text("temperature: "+this.temperature, this.x,this.y);

      text("star type: " + this.type, this.x,this.y + 15)

    }

  }

}

​