This is what I could come up with today, I’m not good with Processing Syntax, go through it and correct the Syntax or someone from the community will help. I did not use the image too. Cheers
PImage SpainMap;
// Multidimensional Array
// Position X of every city
// Position Y
// Population of the city
int cities = {
{930, 350, 800000},
{1063, 215, 1660000},
{900, 190, 675000},
{865, 115, 209000},
{825, 138, 151000},
{813, 111, 254000},
{750, 70, 172000},
{640, 70, 218000},
{490, 110, 98000},
{690, 190, 298000},
{755, 278, 3300000},
{738, 317, 85000},
{613, 378, 59000},
{633, 485, 684000},
{895, 445, 461000},
{1093, 335, 419000},
{667, 591, 83500},
{794, 630, 86000},
};
//Color variable
color blau = color (1,60,213); //Blue
color verd = color (0,255,0); //Green
color vermell = color (255,0,0); //Red
color negre = color (0,0,0); //Black
color blanc = color (255,255,255); //Whit
// Cities names
String names = {“Valencia”,“Barcelona”,“Zaragoza”,“Pamplona”, “Logroño”, “Vitoria”,“Santander”, “Oviedo”,“SantiagodC.”,“Valladolid”, “Madrid”, “Toledo”, “Mérida”, “Sevilla”, “Murcia”, “PalmadeM.”, “Ceuta”, “Melilla”};
// number of the cities
int total_Cities = 18;
// Variable to save the distance between cities
int distance;
// Array to save the position on X, Y and the distance between Santiago and the other cities
int distances = new int[3];
void setup(){
size(1227, 639);
// Load Image
SpainMap = loadImage(“MapaEsp.png”);
// Reajust the image
SpainMap.resize(1227, 639);
}
void draw(){
image(SpainMap, 0, 0);
// Bucle to generate circles
for (int i=0; i<cities.length; i++){
for (j = 0; j < cities[i].length; j++){
//Variable to modify the size of the circle
float circle_D = map (cities [i] [j], 59000, 3300000, 5,60);
//Conditional estructure
if (cities [i] [j] < 200000) { //Cities < 200.000 population
fill (blau); //
circle (cities [4][0], cities [4][1], circle_D);
circle (cities [6][0], cities [6][1], circle_D);
circle (cities [8][0], cities [8][1], circle_D);
circle (cities [11][0], cities [11][1], circle_D);
circle (cities [12][0], cities [12][1], circle_D);
circle (cities [16][0], cities [16][1], circle_D);
circle (cities [17][0], cities [17][1], circle_D);
} else if (cities [i] [j] > 200000 && cities [i] [j] < 400000) { //Cities > 200.000 and < 400.000 population
fill (verd);
circle (cities [3][0], cities [3][1], circle_D);
circle (cities [5][0], cities [5][1], circle_D);
circle (cities [7][0], cities [7][1], circle_D);
circle (cities [9][0], cities [9][1], circle_D);
} else if (cities [i] [j] > 400000) { //Cities > 400.000 population
fill (vermell);
circle (cities [0][0], cities [0][1], circle_D);
circle (cities [1][0], cities [1][1], circle_D);
circle (cities [2][0], cities [2][1], circle_D);
circle (cities [10][0], cities [10][1], circle_D);
circle (cities [13][0], cities [13][1], circle_D);
circle (cities [14][0], cities [14][1], circle_D);
circle (cities [15][0], cities [15][1], circle_D);
}
}
////Bucle to generate the name of the cities
//for (int i = 0; i<names.length; i++){
//fill (negre); //farcit del text
//text (names [i], cities [i][0]+10, cities [i][1]); //names of the cities
//}
////Elements of the legend
//float x = width/61.35;
//int base = width/3;
//int altura = base/4;
//float diametre = x/2;
////Rect of the legend
//fill(blanc);
//rect (x, height-altura-x, base , altura);
//fill (blau);
//circle (2x, height-altura+x, diametre);
//fill (verd); //farcilt del cercle
//circle (2x, height-altura+2x, diametre);
//fill (vermell);
//circle (2x, height-altura+3x, diametre);
//fill (negre);
////Texts of the legend
//text (“LLEGENDA”, x+x/2, height-altura);
//text (“Ciutats amb menys de 200.000 habitants”, 3x, height-altura+x+diametre/2);
//text (“Ciutats amb més de 200.000 habitants i menys de 400,000”, 3x, height-altura+2x+diametre/2);
//text (“Ciutats amb més de 400.000 habitants”, 3x, height-altura+3x+diametre/2);
//}
//int calc_Distance(int posX_1, int posY_1, int posX_2, int posY_2){
//// Apliquem Pitàgores i tornem el valor de la distància entre ciutats
//return(int(sqrt(pow(posX_2-posX_1,2)+pow(posY_2-posY_1,2))));
//}
}
}
}