hello

index.html

@@ -32,12 +32,36 @@
       top: 0;
       overflow: scroll
     }
+
+    #map {
+      height: 180px;
+    }
   </style>
+  <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
+    integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin="" />
+  <script src="https://unpkg.com/[email protected]/dist/leaflet.js"
+    integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
+
 </head>
 <div id='sidepane'>
   <div style="padding: 5%">
     <h1>Sandbox for OSM editting</h1>
+    <div id="map"></div>
+    <script>
+
+      const queryString = window.location.search;
+      console.log(queryString);
 
+      const map = L.map('map').setView([51.505, -0.09], 13);
+
+      const tiles = L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
+        maxZoom: 19,
+        attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
+      }).addTo(map);
+
+      map.setView(new L.LatLng(40.737, -73.923), 8);
+
+    </script>
     <p>
       Lorem ipsum odor amet, consectetuer adipiscing elit. Eleifend mattis blandit fringilla urna interdum. Parturient
       accumsan amet justo primis; viverra sodales arcu. Mauris erat quisque semper etiam ad metus cursus. Nascetur nam
@@ -67,7 +91,7 @@ <h1>Sandbox for OSM editting</h1>
       adipiscing habitasse natoque. Orci nec dis vulputate bibendum justo lorem interdum turpis. Metus hac cubilia
       suspendisse habitasse aliquam cursus. Purus praesent tellus interdum nullam dictum vulputate maximus.
     </p>
-    
+
 
 
   </div>