fixing fit Bounds to test flyTo

Iconem · Jun 24, 2024 · ca5c3ad · ca5c3ad
1 parent 12b39bd
commit ca5c3ad
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 5 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -329,7 +329,7 @@ function App() {
         <GeocoderControl
           mapboxAccessToken={MAPBOX_TOKEN}
           position="top-left"
-          flyTo={{ speed: 2.5 }}
+          flyTo={{ speed: 0.5 }}
           mapRef={leftMapRef}
         />
 

diff --git a/src/control-panel.tsx b/src/control-panel.tsx
@@ -37,7 +37,6 @@ import {
   useLocalStorage,
   // convertLatlonTo3857,
 } from "./utilities";
-import { width } from "@fortawesome/free-solid-svg-icons/fa0";
 
 const TITILER_ENDPOINT = "https://titiler.xyz"; // https://app.iconem.com/titiler
 const MAX_FRAME_RESOLUTION = 2048; // 1024 - 2048

diff --git a/src/geocoder-control.tsx b/src/geocoder-control.tsx
@@ -8,10 +8,10 @@ import {
   type ControlPosition,
 } from "react-map-gl";
 import type * as React from "react";
-
+import mapboxgl from "mapbox-gl";
 import MapboxGeocoder, {
   type GeocoderOptions,
-} from "@mapbox/mapbox-gl-geocoder";
+} from '@mapbox/mapbox-gl-geocoder';
 
 type GeocoderControlProps = Omit<
   GeocoderOptions,
@@ -103,7 +103,19 @@ export default function GeocoderControl(
       ctrl.on("result", (evt) => {
         console.log("RESULT", evt);
         // props.onResult(evt)
-        props.mapRef?.current?.fitBounds(evt?.result?.bbox, {
+
+        let bounds = evt?.result?.bbox ? evt?.result?.bbox : new mapboxgl.LngLatBounds(
+          {
+          lng: evt?.result.center[0] - 0.25,
+          lat: evt?.result.center[1] -0.25
+          }, 
+          {
+            lng: evt?.result.center[0] + 0.25,
+            lat: evt?.result.center[1] + 0.25
+          }
+        );
+
+        props.mapRef?.current?.fitBounds(bounds, {
           padding: 0,
           center: evt?.result?.center,
         });