diff --git a/img/icons/campground.svg b/img/icons/campground.svg
new file mode 100644
index 0000000..ec86a17
--- /dev/null
+++ b/img/icons/campground.svg
@@ -0,0 +1,8 @@
+
\ No newline at end of file
diff --git a/img/icons/house.svg b/img/icons/house.svg
new file mode 100644
index 0000000..d2c6914
--- /dev/null
+++ b/img/icons/house.svg
@@ -0,0 +1,8 @@
+
\ No newline at end of file
diff --git a/img/icons/star.svg b/img/icons/star.svg
new file mode 100644
index 0000000..9ba76a8
--- /dev/null
+++ b/img/icons/star.svg
@@ -0,0 +1,8 @@
+
\ No newline at end of file
diff --git a/img/icons/village.svg b/img/icons/village.svg
new file mode 100644
index 0000000..5bfc453
--- /dev/null
+++ b/img/icons/village.svg
@@ -0,0 +1,40 @@
+
+
+
diff --git a/img/locations/guratol_county.webp b/img/locations/guratol_county.webp
new file mode 100644
index 0000000..1141fa5
Binary files /dev/null and b/img/locations/guratol_county.webp differ
diff --git a/img/locations/migam_domain.webp b/img/locations/migam_domain.webp
new file mode 100644
index 0000000..ac06a76
Binary files /dev/null and b/img/locations/migam_domain.webp differ
diff --git a/img/locations/ogre_village.webp b/img/locations/ogre_village.webp
new file mode 100644
index 0000000..093526d
Binary files /dev/null and b/img/locations/ogre_village.webp differ
diff --git a/img/locations/tengu_village.webp b/img/locations/tengu_village.webp
new file mode 100644
index 0000000..5301915
Binary files /dev/null and b/img/locations/tengu_village.webp differ
diff --git a/js/SlimeMap.js b/js/SlimeMap.js
index 3b31c97..b15023d 100644
--- a/js/SlimeMap.js
+++ b/js/SlimeMap.js
@@ -7,15 +7,18 @@ export default class SlimeMap extends Map {
* @param nations
* @param capitals
* @param pois
+ * @param cities
*/
- constructor(svgId, mapImage, nations, capitals, pois) {
+ constructor(svgId, mapImage, nations, capitals, pois, cities) {
super(svgId, mapImage);
this.nations = nations;
this.capitals = capitals;
this.pois = pois;
+ this.cities = cities;
this.addNations();
this.addCapitals();
this.addPOIs();
+ this.addCities();
}
addNations() {
@@ -38,7 +41,7 @@ export default class SlimeMap extends Map {
addCapitals() {
for (let capital of this.capitals) {
const svgString = `
-
+
+ stroke="black" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" />
+
+
+ `;
+ this.addSVGElement(svgString);
+ }
+ }
+
+ addCities() {
+ for (let city of this.cities) {
+ const svgString = `
+
+
+
+
+
+
`;
this.addSVGElement(svgString);
}
@@ -57,7 +87,7 @@ export default class SlimeMap extends Map {
addPOIs() {
for (let poi of this.pois) {
const svgString = `
-
-
-
+
+
+
+
+
`;
this.addSVGElement(svgString);
}
diff --git a/js/locations/cities.js b/js/locations/cities.js
new file mode 100644
index 0000000..db3a9c0
--- /dev/null
+++ b/js/locations/cities.js
@@ -0,0 +1,76 @@
+/**
+ * @typedef {Object} CityData
+ * @property {string} name
+ * @property {string?} description
+ * @property {CityImage?} image
+ * @property {string?} url
+ * @property {{x:string,y:string}} position
+ */
+
+/**
+ * @typedef {Object} CityImage
+ * @property {string} url
+ * @property {string} name
+ * @property {string} credit
+ */
+
+/**
+ * @type {[CapitalData]}
+ */
+export const cities = [
+ {
+ name: "Tengu Village",
+ description: "The village of the Tengu tribe, located in the Khusha Mountains.",
+ image: {
+ url: "img/locations/tengu_village.webp",
+ name: "Tengu Village from Episode 64",
+ credit: "Screenshot from Tensei Shitara Slime Datta Ken, Episode 64."
+ },
+ position: { x: "1638", y: "1252" }
+ },
+ {
+ name: "Ogre Village",
+ description: "The site of the former Ogre Village, prior to it being destroyed in the Orc War.",
+ image: {
+ url: "img/locations/ogre_village.webp",
+ name: "Ogre Village from Episode 1",
+ credit: "Screenshot from Tensei Shitara Slime Datta Ken, Episode 1. Sourced from the Tensei Shitara Slime Datta Ken Wiki"
+ },
+ position: { x: "1780", y: "1190" }
+ },
+ {
+ name: "Treant Village",
+ description: "The former location of the Treant Village, prior to them moving to Floor 95 of the Dungeon.",
+ position: { x: "1957", y: "1100" }
+ },
+ {
+ name: "Gozu and Mezu Villages",
+ description: "The homeland of both the Gozu and the Mezu tribes, which has been ravaged by their conflict for the last century.",
+ position: { x: "1990", y: "1020" }
+ },
+ {
+ name: "Migam Earldom",
+ description: "The territory of the noble house of Migam, in charge of the nation's border with the Jura Forest.",
+ image: {
+ url: "img/locations/migam_domain.webp",
+ name: "Migam Earldom from Episode 57",
+ credit: "Screenshot from Tensei Shitara Slime Datta Ken, Episode 57. Sourced from the Tensei Shitara Slime Datta Ken Wiki"
+ },
+ position: { x: "1540", y: "930" }
+ },
+ {
+ name: "Muller March",
+ description: "The territory of the noble house of muller, distant relatives of the Blumund royal family.",
+ position: { x: "1465", y: "980" }
+ },
+ {
+ name: "Guratol County",
+ description: "A small territory ruled by Count Guratol with his wife Ulamuth Guratol.",
+ image: {
+ url: "img/locations/guratol_county.webp",
+ name: "Guratol County",
+ credit: "Screenshot from Tensei Shitara Slime Datta Ken. Sourced from the Tensei Shitara Slime Datta Ken Wiki"
+ },
+ position: { x: "1224", y: "1010" }
+ },
+];
\ No newline at end of file
diff --git a/js/locations/index.js b/js/locations/index.js
index 8943a87..99ae579 100644
--- a/js/locations/index.js
+++ b/js/locations/index.js
@@ -1,3 +1,4 @@
export * from "./pois.js";
export * from "./nations.js";
-export * from "./capitals.js";
\ No newline at end of file
+export * from "./capitals.js";
+export * from "./cities.js";
\ No newline at end of file
diff --git a/js/locations/pois.js b/js/locations/pois.js
index b1a69e1..fdab84f 100644
--- a/js/locations/pois.js
+++ b/js/locations/pois.js
@@ -27,7 +27,7 @@ export const pois = [
credit: "Screenshot from Tensei Shitara Slime Datta Ken. Sourced from the Tensei Shitara Slime Datta Ken Wiki"
},
url: "https://tensura.fandom.com/wiki/Sealed_Cave",
- position: { x: "1680", y: "1080" }
+ position: { x: "1660", y: "1060" }
},
{
name: "Lake Siss",
@@ -38,7 +38,7 @@ export const pois = [
credit: "Screenshot from Tensei Shitara Slime Datta Ken. Sourced from the Tensei Shitara Slime Datta Ken Wiki"
},
url: "https://tensura.fandom.com/wiki/Lake%20Siss",
- position: { x: "1850", y: "1121" }
+ position: { x: "1835", y: "1100" }
},
{
name: "Khusha Mountains",
@@ -49,18 +49,18 @@ export const pois = [
credit: "Screenshot from Tensei Shitara Slime Datta Ken, Episode 64. Sourced from the Tensei Shitara Slime Datta Ken Wiki"
},
url: "https://tensura.fandom.com/wiki/Khusha%20Mountains",
- position: { x: "1618", y: "1240" }
+ position: { x: "1600", y: "1180" }
},
{
name: "Scroching God Mountain",
description: "The holy mountain where the scorch dragon Velgrynd is said to reside.",
url: "https://tensura.fandom.com/wiki/Scorching%20God%20Mountain",
- position: { x: "2111", y: "700" }
+ position: { x: "2088", y: "680" }
},
{
name: "Dragon's Den",
description: "At the peak of the tallest mountain, the Great Canaat Mountains, lies the Dragon's Den where the Dragon Lords reside.",
- position: { x: "1740", y: "665" }
+ position: { x: "1720", y: "650" }
},
{
name: "Charybdis Cave",
@@ -70,30 +70,30 @@ export const pois = [
name: "Charybdis Cave from Episode 18",
credit: "Screenshot from Tensei Shitara Slime Datta Ken, Episode 18. Sourced from the Tensei Shitara Slime Datta Ken Wiki"
},
- position: { x: "1956", y: "1010" }
+ position: { x: "1925", y: "990" }
},
{
name: "Divine Tree",
description: "The Divine Tree, a sacred relic designed to maintain the world. It is home to Elmine, Sarion's Capital.",
url: "https://tensura.fandom.com/wiki/Divine%20Tree",
- position: { x: "1420", y: "1450" }
+ position: { x: "1402", y: "1435" }
},
{
name: "Ulgr Nature Park",
description: "A nature preserve that was formerly home to the Dwelling of the Spirits.",
- position: { x: "1480", y: "1520" }
+ position: { x: "1460", y: "1500" }
},
{
name: "Heaven Tower",
description: "The entrance to the Star Palace.",
url: "https://tensura.fandom.com/wiki/Heaven%20Tower",
- position: { x: "350", y: "1205" }
+ position: { x: "330", y: "1170" }
},
{
name: "Magic Tower",
description: "The scholarly facility created by the Trinity Wisemen.",
url: "https://tensura.fandom.com/wiki/Magic%20Tower",
- position: { x: "1165", y: "1375" }
+ position: { x: "1138", y: "1355" }
},
{
name: "Barren Lands",
diff --git a/js/mapBuilder.js b/js/mapBuilder.js
index f16923a..ba0eba9 100644
--- a/js/mapBuilder.js
+++ b/js/mapBuilder.js
@@ -1,4 +1,4 @@
-import {pois, capitals, nations} from "./locations";
+import {pois, capitals, nations, cities} from "./locations";
import SlimeMap from "./SlimeMap.js";
-const slimeMap = new SlimeMap("map", "img/map.webp", nations, capitals, pois);
\ No newline at end of file
+const slimeMap = new SlimeMap("map", "img/map.webp", nations, capitals, pois, cities);
\ No newline at end of file