added debug info

src/modules/KmMarks.ts

@@ -77,10 +77,10 @@ class Component extends LayerGroup {
 
   createMiddleMarker = (latlng: LatLngLiteral, angle: number, distance: number): Marker => marker(latlng, {
     draggable: false,
-    interactive: false,
+    interactive: true,
     icon: divIcon({
       html: `
-        <div class="leaflet-km-dist" style="transform: translate(0, 0) rotate(${allwaysPositiveAngleDeg(angle)}deg);">
+        <div class="leaflet-km-dist" style="transform: translate(-50%, -50%) rotate(${allwaysPositiveAngleDeg(angle)}deg);">
           ${distance}
         </div>
       `,

src/modules/Sticker.tsx

@@ -55,6 +55,8 @@ export class Sticker {
     this.deleteSticker = deleteSticker;
     this.lockMapClicks = lockMapClicks;
 
+    console.log({ set, sticker });
+
     ReactDOM.render(
       <React.Fragment>
         <div

src/styles/map.less

@@ -121,8 +121,8 @@
     align-items: center;
     justify-content: center;
     position: relative;
-    top: 0;
+    top: 50%;
-    left: -4px;
+    left: 50%;
     font-weight: bold;
     padding: 0 2px;
   }

webpack.config.js

@@ -143,6 +143,7 @@ module.exports = () => {
     devServer: {
       historyApiFallback: true,
       port: 8000,
+      host: '192.168.88.40',
       contentBase: 'dist',
       publicPath: '/',
       hot: true,