add polygon labels

Author: mysticdrew

src/main/js/journeymap.js

@@ -627,7 +627,8 @@ class Journeymap {
 
                 coords = [[coords], holes]
             }
-
+            let firstPoint = Object.values(polygon.points)
+            let className = "polygon-" + (translateCoords(firstPoint[0].x, firstPoint[0].z) + "_" + polygon.label).replaceAll(",", "_").replaceAll(":", "_").replaceAll(" ", "_").replaceAll("\n", "").toLowerCase()
             polygons.push({
                 latLngs: coords,
 
@@ -637,7 +638,9 @@ class Journeymap {
 
                 fillColor: polygon.fillColor,
                 fillOpacity: polygon.fillOpacity,
-
+                label: polygon.label,
+                fontColor: polygon.fontColor,
+                className: className,
                 texturePositionX: polygon.texturePositionX,
                 texturePositionY: polygon.texturePositionY,
                 textureScaleX: polygon.textureScaleX,

src/main/resources/assets/journeymap/web/index.html

@@ -21,19 +21,26 @@
 <div id="main">
     <v-style v-if="visibleWaypoints">
         <template v-for="(waypoint) in waypoints">
-.leaflet-tooltip.{{waypoint.className}} {
-    color: {{waypoint.tooltipColor}};
-    border-color: {{waypoint.tooltipColor}};
-}
+            .leaflet-tooltip.{{ waypoint.className }} {
+            color: {{ waypoint.tooltipColor }};
+            border-color: {{ waypoint.tooltipColor }};
+            }
+        </template>
+    </v-style>
+    <v-style v-if="visiblePolygons">
+        <template v-for="(polygon) in polygons">
+            .leaflet-tooltip.{{ polygon.className }} {
+            color: {{ polygon.fontColor }};
+            border-color: {{ polygon.strokeColor }};
+            }
         </template>
     </v-style>
-
     <v-style v-if="visibleAnimals || visibleMobs || visibleVillagers">
         <template v-for="(marker) in markers">
             <template v-if="marker.color !== undefined">
-.leaflet-tooltip.{{ marker.key.replaceAll("/", "_") }} {
-    border-color: {{ marker.color }};
-}
+                .leaflet-tooltip.{{ marker.key.replaceAll("/", "_") }} {
+                border-color: {{ marker.color }};
+                }
             </template>
         </template>
     </v-style>
@@ -182,7 +189,8 @@
                   v-if="visibleWaypoints"
                   v-for="(waypoint) in waypoints"
         >
-            <l-tooltip :options="{permanent: true, direction: 'center', offset: [0, 43], className: waypoint.className}">
+            <l-tooltip
+                    :options="{permanent: true, direction: 'center', offset: [0, 43], className: waypoint.className}">
                 {{ waypoint.name }}
             </l-tooltip>
         </l-marker>
@@ -215,7 +223,11 @@
 
                    v-if="visiblePolygons"
                    v-for="(polygon) in polygons"
-        ></l-polygon>
+        >
+            <l-tooltip :options="{permanent: true, direction: 'center', offset: [0, 32], className: polygon.className}">
+                {{ polygon.label }}
+            </l-tooltip>
+        </l-polygon>
     </l-map>
 
     <b-collapse :open.sync="settingsVisible"