fix: change tile layer

src/App.tsx

@@ -7,8 +7,8 @@ interface AppProps {}
 
 function App({}: AppProps) {
   const hamburgCenter: LatLngExpression = [
-    53.55035993851227,
-    9.986701679608633,
+    53.550359,
+    9.986701,
   ];
   return (
     <MapContainer
@@ -19,7 +19,12 @@ function App({}: AppProps) {
     >
       <TileLayer
         attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
-        url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
+        url="https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}"
+        id="mapbox/streets-v11"
+        tileSize={512}
+        accessToken="pk.eyJ1IjoicHJleWEyayIsImEiOiJja202N2JucGowbGU4MnB1aWtxNGkzMW9jIn0.rVBLRZtohLEgdSLO0nlWng"
+        zoomOffset={-1}
+        maxZoom={18}
       />
       <Marker position={hamburgCenter}>
         <Popup>