2025 dario.technology

  https://editor.p5js.org/mcoirad/full/om-x0gXQF

*/

​

let noiseCanvas;

let uniqueTerritoryMap;

let cityNamesOverlay;

let noiseScale = 0.015;

let noiseSeedValue = "";

let heightMap = [];

let waterLevel = 0.3;

let gradientType = "radial";

let noiseType = "basic";

let numCities = 70;

let cities = [];

let numWaterCities = 30;

let waterCities = [];

let minLandDistance = 20;

let noiseGrid = [];

let territories = [];

let cityGroups = [];

let X = 7; // Number of groups

let Y = 6; // Cities per group

let startingSupplyNum = 3;

let supplyCenters = [];

let selectedUngrouped = [];

​

let imageSourceValues = null;

​

let minWaterDistance = 100;

​

let noiseSeedInput;

let helpIsolatedPlayerRadio;

let modErosionCheck = false;

let buffNumCentralPlayers = 1;

let ensureWaterConnectedCheck = false;

​

let mapSize = 1000;

​

let cityNamesDict = {};

​

let cityConnections = new Set(); // Using a Set to avoid duplicates

​

let waterCityConnections = new Set(); // Tracks water-to-water connections

let landWaterCityConnections = new Set(); // Tracks water-to-land connections

​

let waterGroups = [];

​

let waterCityNames = {};

​

let cityBoundingBoxes = {};

let countryNamesList = [];

let countryNamesListStr = "";

let startingUnits = {};

​

let supplyDensity = 0.5;

let fleetDensity = 0.5;

​

let cityPlacementStrategy = "farthestNearest";

​

function setup() {

  createCanvas(mapSize, mapSize);

​

  noiseCanvas = createGraphics(mapSize, mapSize);

  uniqueTerritoryMap = createGraphics(mapSize, mapSize);

​

  let btn = createButton("Regenerate Map");

  btn.mousePressed(generateNoise);

  btn.position(10, height + 10);

​

  let noiseSeedLabel = createSpan("Random Seed:");

  noiseSeedLabel.position(150, height + 10);

  noiseSeedInput = createInput("12345");

  noiseSeedInput.position(250, height + 10);

​

  let mapSizeLabel = createSpan("Map Size:");

  mapSizeLabel.position(450, height + 10);

  mapSizeInput = createInput("800");

  mapSizeInput.position(550, height + 10);

​

  let gradientSelectLabel = createSpan("Noise Bias:");

  gradientSelectLabel.position(10, height + 40);

  let gradientSelect = createSelect();

  gradientSelect.option("radial");

  gradientSelect.option("horizontal");

  gradientSelect.option("vertical");

  gradientSelect.option("mediterranean");

  gradientSelect.option("peninsula");

  gradientSelect.option("fjords");

  gradientSelect.option("archipelago");

​

  gradientSelect.option("spiral");

  gradientSelect.option("sinusoidal");

  gradientSelect.option("ridge");

  gradientSelect.option("manylakes");

  gradientSelect.option("uploadedimage");

  gradientSelect.option("diamond");

  //gradientSelect.option("concentric"); // I don't really like these

  gradientSelect.option("strata");

  gradientSelect.option("sinusoidal4way");

  //gradientSelect.option("radialbumps");

  gradientSelect.option("quadrant");

  //gradientSelect.option("valley");

  gradientSelect.option("atoll");

  gradientSelect.option("plateau");

  gradientSelect.option("riverdelta");

  gradientSelect.option("isthmus");

  gradientSelect.option("canyon");

  gradientSelect.option("volcano");

  gradientSelect.option("inlet");

​

  gradientSelect.option("none");

  gradientSelect.changed(() => {

    gradientType = gradientSelect.value();

    //generateNoise();

  });

  gradientSelect.position(150, height + 40);

​

  let noiseSelectLabel = createSpan("Noise Generator:");

  noiseSelectLabel.position(300, height + 40);

  let noiseSelect = createSelect();

  noiseSelect.option("basic");

  noiseSelect.option("fractal");

  noiseSelect.option("directional");

  noiseSelect.option("hybridfractal");

​

  noiseSelect.changed(() => {

    noiseType = noiseSelect.value();

    //generateNoise();

  });

  noiseSelect.position(450, height + 40);

​

  let waterLevelLabel = createSpan("Water Level: 0.3 (0-1)");

  waterLevelLabel.position(350, height + 100);

  let waterLevelSelect = createSlider(0, 1, 0.3, 0.05);

  waterLevelSelect.position(500, height + 100);

  waterLevelSelect.changed(() => {

    waterLevel = waterLevelSelect.value();

    waterLevelLabel.html(`Water Level: ${waterLevel}`);

  });

​

  let gradientScaleLabel = createSpan("Noise Scale:");

  gradientScaleLabel.position(10, height + 70);

  let gradientSlider = createSlider(0.001, 0.025, 0.015, 0.001);

  gradientSlider.position(150, height + 70);

  gradientSlider.size(80);

  gradientSlider.changed(() => {

    noiseScale = gradientSlider.value();

    //generateNoise();

  });

​

  let placementLabel = createSpan("Player Placement Algorithm:");

  placementLabel.position(300, height + 70);

  let placementDropdown = createSelect();

  placementDropdown.option("farthestNearest");

  placementDropdown.option("farthestAverage");

  placementDropdown.option("farthestFromCenter");

  placementDropdown.option("gridBased");

  placementDropdown.option("random");

  placementDropdown.position(500, height + 70);

  placementDropdown.changed(() => {

    cityPlacementStrategy = placementDropdown.value();

  });

​

  let numPlayersLabel = createSpan("Number of Players: 7 (2-20)");

  numPlayersLabel.position(10, height + 100);

  let numPlayersSelect = createSlider(2, 20, 7, 1);

  numPlayersSelect.position(200, height + 100);

  numPlayersSelect.changed(() => {

    X = numPlayersSelect.value();

    numPlayersLabel.html(`Number of Players: ${X}`);

  });

​

  let numPlayerCitiesLabel = createSpan("Regions per player: 6 (3-20)");

  numPlayerCitiesLabel.position(10, height + 130);

  let numPlayersCitiesSelect = createSlider(3, 20, 6, 1);

  numPlayersCitiesSelect.position(200, height + 130);

  numPlayersCitiesSelect.changed(() => {

    Y = numPlayersCitiesSelect.value();

    numPlayerCitiesLabel.html(`Regions per player: ${Y}`);

  });

​

  let numWaterRegionsLabel = createSpan("Num water regions: 20 (5-200)");

  numWaterRegionsLabel.position(350, height + 130);

  let numWaterRegionsSelect = createSlider(5, 200, 20, 1);

  numWaterRegionsSelect.position(550, height + 130);

  numWaterRegionsSelect.changed(() => {

    numWaterCities = numWaterRegionsSelect.value();

    numWaterRegionsLabel.html(`Num water regions: ${numWaterCities}`);

  });

​

  let numCitiesLabel = createSpan("Num Land Regions: 60 (20-200)");

  numCitiesLabel.position(10, height + 160);

  let numCitiesSelect = createSlider(20, 200, 60, 1);

  numCitiesSelect.position(200, height + 160);

  numCitiesSelect.changed(() => {

    numCities = numCitiesSelect.value();

    numCitiesLabel.html(`Total Regions: ${numCities}`);

  });

​

  let minLandDistanceLabel = createSpan("Min Land Dist: 20 (5-200)");

  minLandDistanceLabel.position(350, height + 160);

  let minLandDistanceSelect = createSlider(5, 200, 20, 5);

  minLandDistanceSelect.position(550, height + 160);

  minLandDistanceSelect.changed(() => {

    minLandDistance = minLandDistanceSelect.value();

    minLandDistanceLabel.html(`Min Land Dist: ${minLandDistance}`);

  });

​

  let startingSupplyLabel = createSpan("Starting Bases: 3 (1-20)");

  startingSupplyLabel.position(10, height + 190);

  let startingSupplySelect = createSlider(1, 20, 3, 1);

  startingSupplySelect.position(200, height + 190);

  startingSupplySelect.changed(() => {

    startingSupplyNum = startingSupplySelect.value();

    startingSupplyLabel.html(`Starting Bases: ${startingSupplyNum}`);

  });

​

  let minWaterDistanceLabel = createSpan("Min Water Dist: 100 (5-300)");

  minWaterDistanceLabel.position(350, height + 190);

  let minWaterDistanceSelect = createSlider(5, 300, 100, 5);

  minWaterDistanceSelect.position(550, height + 190);

  minWaterDistanceSelect.changed(() => {

    minWaterDistance = minWaterDistanceSelect.value();

    minWaterDistanceLabel.html(`Min Water Dist: ${minWaterDistance}`);

  });

​

  let isolatedPlayerLabel = createSpan(

    "Help Most Isolated Player (adds nearby supply center)"

  );

  isolatedPlayerLabel.position(10, height + 220);

  helpIsolatedPlayerRadio = createRadio();

  helpIsolatedPlayerRadio.position(30, height + 250);

  helpIsolatedPlayerRadio.size(60);

​

  // Add a few color options.

  helpIsolatedPlayerRadio.option("No");

  helpIsolatedPlayerRadio.option("Yes");

​

  // Choose a default option.

  helpIsolatedPlayerRadio.selected("Yes");

​

  let buffCentralPlayersLabel = createSpan(

    "Buff X Most Central Players (adds Home SC): 1 (0-6)"

  );

  buffCentralPlayersLabel.position(10, height + 300);

  let buffCentralPlayersSelect = createSlider(0, 6, 1, 1);

  buffCentralPlayersSelect.position(400, height + 300);

  buffCentralPlayersSelect.changed(() => {

    buffNumCentralPlayers = buffCentralPlayersSelect.value();

    buffCentralPlayersLabel.html(

      `Buff X Most Central Players : ${buffNumCentralPlayers}`

    );

  });

​

  modErosionCheck = createCheckbox("Simulate erosion/Flatten", false);

  modErosionCheck.position(500, height + 220);

​

  let imageInputLabel = createSpan(

    "Image input (use 'uploadedimage' as Noise Bias)"

  );

  imageInputLabel.position(450, height + 250);

  imageInput = createFileInput(handleImageUpload);

  imageInput.position(450, height + 270);

​

  ensureWaterConnectedCheck = createCheckbox(

    "Draw Rivers/Ensure all water areas connected (can take awhile)",

    false

  );

  ensureWaterConnectedCheck.position(10, height + 330);

​

  ensurePlayerWaterConnectedCheck = createCheckbox(

    "Draw Rivers/Ensure each player can access the water (can take awhile)",

    false

  );

  ensurePlayerWaterConnectedCheck.position(10, height + 360);

​

  let supplyDensityLabel = createSpan(

    "Neutral Supply Center Density: 0.5 (0-1)"

  );

  supplyDensityLabel.position(10, height + 390);

  let supplyDensitySelect = createSlider(0, 1, 0.5, 0.1);

  supplyDensitySelect.position(300, height + 390);

  supplyDensitySelect.changed(() => {

    supplyDensity = supplyDensitySelect.value();

    supplyDensityLabel.html(`Neutral Supply Center Density: ${supplyDensity}`);

  });

​

  let fleetCenterDensityLabel = createSpan("Starting fleet Density: 0.5 (0-1)");

  fleetCenterDensityLabel.position(10, height + 420);

  let fleetDensitySelect = createSlider(0, 1, 0.5, 0.1);

  fleetDensitySelect.position(250, height + 420);

  fleetDensitySelect.changed(() => {

    fleetDensity = fleetDensitySelect.value();

    fleetCenterDensityLabel.html(`Starting fleet Density: ${fleetDensity}`);

  });

​

  let downloadButton = createButton("Export as webDip variant (experimental)");

  downloadButton.mousePressed(downloadPHPMapAsZip);

  downloadButton.position(10, height + 450);

​

  generateNoise();

}

​

function generateNoise() {

  createCanvas(parseInt(mapSizeInput.value()), parseInt(mapSizeInput.value()));

  noiseCanvas = createGraphics(width, height);

  uniqueTerritoryMap = createGraphics(width, height);

  clear();

  noiseSeedValue = noiseSeedInput.value();

  if (noiseSeedValue == "") {

    noiseSeedValue = millis();

    //console.log(noiseSeedValue);

  }

  noiseSeed(noiseSeedValue);

  randomSeed(noiseSeedValue);

  noiseCanvas.loadPixels();

  uniqueTerritoryMap.loadPixels();

  noiseGrid = [];

​

  for (let x = 0; x < width; x++) {

    noiseGrid[x] = [];

    heightMap[x] = [];

    for (let y = 0; y < height; y++) {

      let noiseVal = getNoise(x, y);

      let distFactor = getGradientFactor(x, y);

      noiseVal *= 1 - distFactor;

      noiseGrid[x][y] = noiseVal > waterLevel ? 1 : 0; // 1 = land, 0 = water

      heightMap[x][y] = noiseVal;

    }

  }

​

  doMapGeneration();

​

  // Ensure all water zones are connected if feature is set

  let numIterations = 0;

  while (waterGroups.length > 1 && ensureWaterConnectedCheck.checked()) {

    let closestCities = findClosestCitiesBetweenGroups(

      waterGroups[0],

      waterGroups[1]

    );

    console.log("Drawing a river!");

    drawRiver(

      closestCities[0][0],

      closestCities[0][1],

      closestCities[1][0],

      closestCities[1][1],

      2

    );

    doMapGeneration();

    numIterations += 1;

    if (numIterations > 10) {

      console.error(

        `Hit max iterations of ${numIterations} on attempting to connect all waterzones.`

      );

      break;

    }

  }

​

  // Ensure each player has access to the water if feature is set

  let cityGroupsWithoutWater = findCityGroupsWithoutWaterAccess();

  console.log(cityGroupsWithoutWater);

  numIterations = 0;

  while (

    cityGroupsWithoutWater.length > 0 &&

    numIterations < 10 &&

    ensurePlayerWaterConnectedCheck.checked()

  ) {

    let closestCities = findClosestCitiesBetweenGroups(

      cityGroupsWithoutWater[0].map((city) => [city.x, city.y]),

      waterCities.map((city) => [city.x, city.y])

    );

    drawRiver(

      closestCities[0][0],

      closestCities[0][1],

      closestCities[1][0],

      closestCities[1][1],

      2

    );

    doMapGeneration();

    cityGroupsWithoutWater = findCityGroupsWithoutWaterAccess();

    numIterations += 1;

    if (numIterations >= 10) {

      console.error(

        `Hit max iterations of ${numIterations} on attempting to connect all players to waterzones.`

      );

      break;

    }

  }

  generateCountryNames();

  assignStartingUnits();

  cityNamesOverlay = generateCityNamesOverlay();

}

​

function doMapGeneration() {

  //drawRiver(250, 120, 740, 600, 2);

  for (let x = 0; x < width; x++) {

    for (let y = 0; y < height; y++) {

      let current = noiseGrid[x][y];

      let isBorder = false;

​

      for (let dx = -1; dx <= 1; dx++) {

        for (let dy = -1; dy <= 1; dy++) {

          let nx = x + dx;

          let ny = y + dy;

          if (nx >= 0 && nx < width && ny >= 0 && ny < height) {

            if (noiseGrid[nx][ny] !== current) {

              isBorder = true;

            }

          }

        }

      }

​

      let col = isBorder

        ? color(1)

        : current

        ? color(50, 50, 50)

        : color(32, 159, 201);

      noiseCanvas.set(x, y, col);

      uniqueTerritoryMap.set(x, y, col);

    }

  }

  //drawRiver(200, 200, 600, 600);

  noiseCanvas.updatePixels();

  uniqueTerritoryMap.updatePixels();

  placeCities();

  placeWaterCities();

  cityGroups = assignCityGroups(X, Y);

  assignGroupColors();

  generateTerritories();

  generateWaterTerritories();

  if (true) {

    // make an option that can be enabled

    findAndAssignExtraCities(3);

    generateTerritories();

    generateWaterTerritories();

  }

​

  supplyCenters = generateSupplyCenters();

  if (helpIsolatedPlayerRadio.value() == "Yes") {

    helpExpandPlayer(leastExpansivePlayer());

  }

  assignCityNames();

  waterGroups = getWaterRegionGroups();

}

​

function getNoise(x, y) {

  if (noiseType == "basic") {

    return noise(x * noiseScale, y * noiseScale);

  } else if (noiseType == "fractal") {

    let value = 0;

    let scale = 1;

    let amplitude = 1;

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

      // 4 octaves for depth

      value +=

        noise(x * noiseScale * scale, y * noiseScale * scale) * amplitude;

      scale *= 2;

      amplitude *= 0.5;

    }

    return value;

  } else if (noiseType === "directional") {

    let angle = noise(x * noiseScale, y * noiseScale) * TWO_PI;

    return sin(angle) * 0.5 + 0.5;

  } else if (noiseType === "hybridfractal") {

    let value = noise(x * noiseScale, y * noiseScale);

    let frequency = 2.0;

    let amplitude = 1.0;

    let gain = 0.5;

    let offset = 1.0;

​

    for (let i = 1; i < 5; i++) {

      let signal = abs(

        noise(x * noiseScale * frequency, y * noiseScale * frequency)

      );

      signal = offset - signal;

      signal *= signal;

      value += signal * amplitude;

      frequency *= 2.0;

      amplitude *= gain;

    }

    return value;

  }

}

​

function getGradientFactor(x, y) {

  let centerX = width / 2;

  let centerY = height / 2;

  let maxDist = dist(0, 0, centerX, centerY);

​

  let gradientValue = 0; // Default value

  let riverEffect = 0;

​

  if (gradientType === "radial") {

    gradientValue = dist(x, y, centerX, centerY) / maxDist - x / width / 3;

  } else if (gradientType === "horizontal") {

    gradientValue = x / width - dist(x, y, centerX, centerY) / maxDist / 2;

  } else if (gradientType === "vertical") {

    gradientValue = y / height - dist(x, y, centerX, centerY) / maxDist / 2;

  } else if (gradientType === "mediterranean") {

    gradientValue =

      1 - dist(x, y, centerX, centerY) / maxDist - x / width / 1.5;

  } else if (gradientType === "sinusoidal") {

    gradientValue =

      (sin((x / width) * PI * 2) + sin((y / height) * PI * 2)) / 2;

  } else if (gradientType === "spiral") {

    gradientValue =

      sin(dist(x, y, centerX, centerY) * 0.1) * 0.5 -

      dist(x, y, centerX, centerY) / maxDist / 2;

  } else if (gradientType === "ridge") {

    gradientValue = abs((y - centerY) / centerY);

  } else if (gradientType === "manylakes") {

    let plate = abs(sin((x / width) * PI * 4) + cos((y / height) * PI * 4));

    return plate * 0.6 - dist(x, y, centerX, centerY) / maxDist;

  } else if (gradientType === "none") {

    gradientValue = 0;

  } else if (gradientType === "uploadedimage") {

    gradientValue = imageSourceValues[x][y];

    return gradientValue;

  } else if (gradientType === "concentric") {

    gradientValue = sin(dist(x, y, centerX, centerY) * 0.2) * 0.5;

  } else if (gradientType === "diamond") {

    gradientValue = (abs(x - centerX) + abs(y - centerY)) / maxDist;

  } else if (gradientType === "sinusoidal4way") {

    gradientValue = (sin(x * 0.01) + cos(y * 0.01)) * 0.5;

  } else if (gradientType === "quadrant") {

    gradientValue =

      (x < centerX ? y / height : (height - y) / height) -

      dist(x, y, centerX, centerY) / maxDist / 3;

  } else if (gradientType === "radialbumps") {

    gradientValue = (sin(dist(x, y, centerX, centerY) * 0.3) + 1) / 2;

  } else if (gradientType === "strata") {

    gradientValue = y / height + sin(y * 0.01) * 0.3;

  } else if (gradientType === "valley") {

    gradientValue =

      abs(y - centerY) / height - dist(x, y, centerX, centerY) / maxDist / 2;

  } else if (gradientType === "fjords") {

    let fjordEffect = sin(y * 0.02) * 0.4;

    gradientValue =

      x / width - fjordEffect - dist(x, y, centerX, centerY) / maxDist / 2;

  } else if (gradientType === "peninsula") {

    let dx = x - centerX * 0.5; // Offset to one side

    let dy = y - centerY;

    let radialFactor = dist(dx, dy, 0, 0) / maxDist;

    gradientValue = radialFactor - (x / width) * 0.3;

  } else if (gradientType === "archipelago") {

    gradientValue =

      1 -

      (sin(x * 0.015) * cos(y * 0.015)) / 2 -

      dist(x, y, centerX, centerY) / maxDist;

  } else if (gradientType === "atoll") {

    let radialFactor = dist(x, y, centerX, centerY) / maxDist;

    gradientValue = 1 - sin(radialFactor * PI * 1.6) * 0.4 - radialFactor * 0.8;

  } else if (gradientType === "plateau") {

    gradientValue = (y / height) * 0.7 + sin(x * 0.02) * 0.1;

  } else if (gradientType === "riverdelta") {

    let riverEffect = abs(sin(x * 0.01)) * 0.4;

    gradientValue =

      1 - riverEffect - dist(x, y, centerX, centerY) / maxDist / 2;

  } else if (gradientType === "isthmus") {

    let dx = abs(x - centerX);

    let landmassFactor = exp(-pow((dx / width) * 4, 4)); // Keeps a narrow land bridge

    gradientValue =

      -landmassFactor + (dist(x, y, centerX, centerY) / maxDist) * 2;

  } else if (gradientType === "canyon") {

    let canyonX = width * 0.5;

    let depth = exp(-pow(((x - canyonX) / width) * 5, 2));

    gradientValue = depth - (y / height) * 0.4;

  } else if (gradientType === "volcano") {

    let radialFactor = dist(x, y, centerX, centerY) / maxDist;

    gradientValue =

      exp(-pow(radialFactor * 3, 2)) - exp(-pow(radialFactor * 8, 2));

  } else if (gradientType === "inlet") {

    let ridgeLine = sin((x / width) * PI * 2) * 0.3;

    gradientValue =

      1 -

      abs(y / height - ridgeLine) * 2 -

      dist(x, y, centerX, centerY) / maxDist / 2;

  }

​

  if (modErosionCheck.checked()) {

    gradientValue *= 1 - sin((x / width) * PI) * sin((y / height) * PI);

  }

​

  return gradientValue;

}

​

function placeCities() {

  cities = [];

  let attempts = 1000;

  while (cities.length < numCities && attempts > 0) {

    let x = floor(random(width));

    let y = floor(random(height));

​

    // Ensure city is placed on land

    if (noiseGrid[x][y] < waterLevel) {

      attempts--;

      continue;

    }

​

    let valid = true;

    for (let city of cities) {

      if (dist(x, y, city.x, city.y) < minLandDistance) {

        valid = false;

        break;

      }

    }

​

    if (valid) {

      cities.push({ x, y });

    }

    attempts--;

  }

}

​

function placeWaterCities() {

  waterCities = [];

  let attempts = 1000;

  while (waterCities.length < numWaterCities && attempts > 0) {

    let x = floor(random(width));

    let y = floor(random(height));

​

    // Ensure city is placed on land

    if (noiseGrid[x][y] > waterLevel) {

      attempts--;

      continue;

    }

​

    let valid = true;

    for (let city of waterCities) {

      if (dist(x, y, city.x, city.y) < minWaterDistance) {

        valid = false;

        break;

      }

    }

​

    if (valid) {

      waterCities.push({ x, y });

    }

    attempts--;

  }

}

​

function findAndAssignExtraCities(numExtraCities) {

  let unassignedLandSets = [];

  let visited = new Set();

​

  // Find unassigned land areas

  function floodFill(startX, startY) {

    let stack = [[startX, startY]];

    let landSet = new Set();

​

    while (stack.length > 0) {

      let [x, y] = stack.pop();

      let key = `${x},${y}`;

​

      if (visited.has(key)) continue;

      visited.add(key);

      landSet.add([x, y]);

​

      let neighbors = [

        [x - 1, y],

        [x + 1, y],

        [x, y - 1],

        [x, y + 1],

      ];

​

      for (let [nx, ny] of neighbors) {

        let nKey = `${nx},${ny}`;

        if (

          nx >= 0 &&

          nx < width &&

          ny >= 0 &&

          ny < height &&

          !visited.has(nKey) &&

          noiseGrid[nx][ny] > waterLevel && // Must be land

          territories[nx][ny] === null // Must not already belong to a territory

        ) {

          stack.push([nx, ny]);

        }

      }

    }

​

    return landSet;

  }

​

  // Identify and group unassigned land areas

  for (let x = 0; x < width; x++) {

    for (let y = 0; y < height; y++) {

      let key = `${x},${y}`;

      if (

        !visited.has(key) &&

        noiseGrid[x][y] > waterLevel && // Must be land

        territories[x][y] === null // Must not already belong to a territory

      ) {

        let newLandSet = floodFill(x, y);

        if (newLandSet.size > 0) {

          unassignedLandSets.push(newLandSet);

        }

      }

    }

  }

​

  unassignedLandSets.sort((a, b) => b.size - a.size);

​

  // Assign up to numExtraCities extra cities in these regions

  let extraCities = [];

  for (let i = 0; i < numExtraCities && unassignedLandSets.length > 0; i++) {

    let chosenSet = Array.from(unassignedLandSets[0]); // Convert Set to Array

    let randomPoint = chosenSet[floor(random(chosenSet.length))]; // Pick a random point

​

    let newCity = { x: randomPoint[0], y: randomPoint[1] };

    cities.push(newCity);

    extraCities.push(newCity);

​

    // Mark the territory as occupied

    //territories[newCity.x][newCity.y] = cities.length - 1;

​

    // Remove the processed set

    unassignedLandSets.shift();

  }

​

  console.log(`Added ${extraCities.length} extra cities:`, extraCities);

  return extraCities;

}

​

function generateTerritories() {

  territories = Array.from(Array(width), () => new Array(height).fill(null));

  let queue = new PriorityQueue({

    comparator: (a, b) => a.score - b.score, // Min-heap, lowest score first

  });

​

  let cityToGroup = new Map();

  cityGroups.forEach((group, groupIndex) => {

    group.forEach((city) => {

      cityToGroup.set(city, groupIndex);

    });

  });

​

  let cityConnectionsSet = new Set(); // Use a Set to avoid duplicates

  cityConnections = []; // Store the final unique connections

​

  function weight(x1, y1, x2, y2) {

    let horiz = Math.sqrt((x2 - x1) ** 2 + (y2 - y1) ** 2);

    let vert = heightMap[x2][y2] - heightMap[x1][y1];

    if (vert > 0) vert *= 500;

    let diff = 1 + 0.25 * Math.pow(vert / horiz, 2);

    return horiz * diff;

  }

​

  let territoryColors = {}; // Store colors for each land territory

​

  let usedColors = new Set(); // Track used colors

​

  function getUniqueColor() {

    let r, g, b, newColor;

    do {

      r = floor(random(50, 200));

      g = floor(random(50, 200));

      b = floor(random(50, 200));

      newColor = color(r, g, b);

    } while (usedColors.has(newColor.toString())); // Ensure uniqueness

    usedColors.add(newColor.toString());

    return newColor;

  }

​

  let visited = new Set();

​

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

    let city = cities[i];

    let key = `${city.x},${city.y}`;

    territories[city.x][city.y] = i;

    visited.add(key);

    queue.queue({ x: city.x, y: city.y, cityIndex: i, score: 0 });

  }

​

  while (queue.length > 0) {

    let { x, y, cityIndex, score } = queue.dequeue();

    let neighbors = [

      { dx: -1, dy: 0 },

      { dx: 1, dy: 0 },

      { dx: 0, dy: -1 },

      { dx: 0, dy: 1 },

    ];

​

    for (let { dx, dy } of neighbors) {

      let nx = x + dx;

      let ny = y + dy;

      let key = `${nx},${ny}`;

      if (

        nx >= 0 &&

        nx < width &&

        ny >= 0 &&

        ny < height &&

        !visited.has(key) &&

        noiseGrid[nx][ny] > waterLevel

      ) {

        let newScore = score + weight(x, y, nx, ny);

        territories[nx][ny] = cityIndex;

        visited.add(key);

        queue.queue({ x: nx, y: ny, cityIndex, score: newScore });

      }

    }

  }

​

  noiseCanvas.loadPixels();

  uniqueTerritoryMap.loadPixels();

  for (let x = 0; x < width; x++) {

    for (let y = 0; y < height; y++) {

      if (territories[x][y] !== null) {

        let cityIndex = territories[x][y];

        let city = cities[cityIndex];

        let groupIndex = cityToGroup.get(city);

        let isBorder = false;

​

        if (!territoryColors[cityIndex]) {

          territoryColors[cityIndex] = getUniqueColor();

        }

​

        noiseCanvas.set(x, y, groupColors[groupIndex]);

        uniqueTerritoryMap.set(x, y, territoryColors[cityIndex]);

​

        let neighbors = [

          { dx: -1, dy: 0 },

          { dx: 1, dy: 0 },

          { dx: 0, dy: -1 },

          { dx: 0, dy: 1 },

        ];

​

        for (let { dx, dy } of neighbors) {

          let nx = x + dx;

          let ny = y + dy;

          if (nx >= 0 && nx < width && ny >= 0 && ny < height) {

            if (

              territories[nx][ny] !== null &&

              territories[nx][ny] !== cityIndex

            ) {

              let connectedCityIndex = territories[nx][ny];

              let connectedCity = cities[connectedCityIndex];

​

              // Create a unique key for the connection, ensuring consistent ordering

              let connectionKey =

                city.x < connectedCity.x ||

                (city.x === connectedCity.x && city.y < connectedCity.y)

                  ? `${city.x},${city.y}-${connectedCity.x},${connectedCity.y}`

                  : `${connectedCity.x},${connectedCity.y}-${city.x},${city.y}`;

​

              // Add only if it's not already present

              if (!cityConnectionsSet.has(connectionKey)) {

                cityConnectionsSet.add(connectionKey);

                cityConnections.push([

                  [city.x, city.y],

                  [connectedCity.x, connectedCity.y],

                ]);

              }

​