feat(dae): map zoom in and out
This commit is contained in:
parent
8a25474770
commit
150f23d7a9
2 changed files with 7 additions and 2 deletions
|
|
@ -15,6 +15,7 @@ import MapView from "~/containers/Map/MapView";
|
||||||
import Camera from "~/containers/Map/Camera";
|
import Camera from "~/containers/Map/Camera";
|
||||||
import LastKnownLocationMarker from "~/containers/Map/LastKnownLocationMarker";
|
import LastKnownLocationMarker from "~/containers/Map/LastKnownLocationMarker";
|
||||||
import { DEFAULT_ZOOM_LEVEL } from "~/containers/Map/constants";
|
import { DEFAULT_ZOOM_LEVEL } from "~/containers/Map/constants";
|
||||||
|
import StepZoomButtonGroup from "~/containers/Map/StepZoomButtonGroup";
|
||||||
|
|
||||||
import Text from "~/components/Text";
|
import Text from "~/components/Text";
|
||||||
import Loader from "~/components/Loader";
|
import Loader from "~/components/Loader";
|
||||||
|
|
@ -54,6 +55,7 @@ export default React.memo(function DAEItemCarte() {
|
||||||
const mapRef = useRef();
|
const mapRef = useRef();
|
||||||
const cameraRef = useRef();
|
const cameraRef = useRef();
|
||||||
const [cameraKey, setCameraKey] = useState(1);
|
const [cameraKey, setCameraKey] = useState(1);
|
||||||
|
const [zoomLevel, setZoomLevel] = useState(DEFAULT_ZOOM_LEVEL);
|
||||||
const abortControllerRef = useRef(null);
|
const abortControllerRef = useRef(null);
|
||||||
|
|
||||||
const refreshCamera = useCallback(() => {
|
const refreshCamera = useCallback(() => {
|
||||||
|
|
@ -261,7 +263,7 @@ export default React.memo(function DAEItemCarte() {
|
||||||
: Maplibre.UserTrackingMode.Follow
|
: Maplibre.UserTrackingMode.Follow
|
||||||
}
|
}
|
||||||
followPitch={0}
|
followPitch={0}
|
||||||
zoomLevel={DEFAULT_ZOOM_LEVEL}
|
zoomLevel={zoomLevel}
|
||||||
bounds={bounds}
|
bounds={bounds}
|
||||||
detached={false}
|
detached={false}
|
||||||
/>
|
/>
|
||||||
|
|
@ -322,6 +324,7 @@ export default React.memo(function DAEItemCarte() {
|
||||||
<Maplibre.UserLocation visible showsUserHeadingIndicator />
|
<Maplibre.UserLocation visible showsUserHeadingIndicator />
|
||||||
)}
|
)}
|
||||||
</MapView>
|
</MapView>
|
||||||
|
<StepZoomButtonGroup mapRef={mapRef} setZoomLevel={setZoomLevel} />
|
||||||
|
|
||||||
{/* Route error */}
|
{/* Route error */}
|
||||||
{routeError && !loadingRoute && (
|
{routeError && !loadingRoute && (
|
||||||
|
|
|
||||||
|
|
@ -14,6 +14,7 @@ import MapView from "~/containers/Map/MapView";
|
||||||
import Camera from "~/containers/Map/Camera";
|
import Camera from "~/containers/Map/Camera";
|
||||||
import LastKnownLocationMarker from "~/containers/Map/LastKnownLocationMarker";
|
import LastKnownLocationMarker from "~/containers/Map/LastKnownLocationMarker";
|
||||||
import { BoundType, DEFAULT_ZOOM_LEVEL } from "~/containers/Map/constants";
|
import { BoundType, DEFAULT_ZOOM_LEVEL } from "~/containers/Map/constants";
|
||||||
|
import StepZoomButtonGroup from "~/containers/Map/StepZoomButtonGroup";
|
||||||
|
|
||||||
import Text from "~/components/Text";
|
import Text from "~/components/Text";
|
||||||
import Loader from "~/components/Loader";
|
import Loader from "~/components/Loader";
|
||||||
|
|
@ -103,7 +104,7 @@ export default React.memo(function DAEListCarte() {
|
||||||
// Camera state — simple follow user
|
// Camera state — simple follow user
|
||||||
const [followUserLocation] = useState(true);
|
const [followUserLocation] = useState(true);
|
||||||
const [followUserMode] = useState(Maplibre.UserTrackingMode.Follow);
|
const [followUserMode] = useState(Maplibre.UserTrackingMode.Follow);
|
||||||
const [zoomLevel] = useState(DEFAULT_ZOOM_LEVEL);
|
const [zoomLevel, setZoomLevel] = useState(DEFAULT_ZOOM_LEVEL);
|
||||||
|
|
||||||
const geoJSON = useMemo(() => defibsToGeoJSON(defibs), [defibs]);
|
const geoJSON = useMemo(() => defibsToGeoJSON(defibs), [defibs]);
|
||||||
|
|
||||||
|
|
@ -196,6 +197,7 @@ export default React.memo(function DAEListCarte() {
|
||||||
<Maplibre.UserLocation visible showsUserHeadingIndicator />
|
<Maplibre.UserLocation visible showsUserHeadingIndicator />
|
||||||
)}
|
)}
|
||||||
</MapView>
|
</MapView>
|
||||||
|
<StepZoomButtonGroup mapRef={mapRef} setZoomLevel={setZoomLevel} />
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue