admin/ota-admin-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CEC-4301 - Revise home map zoom to (#333)

Browse Source
This commit is contained in:
Paul Adamsen
2023-05-16 15:44:55 -04:00
committed by GitHub
parent a8972e2f11
commit 6842fb69a0
3 changed files with 26 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/VehicleMap/index.jsx
View File

@@ -12,6 +12,7 @@ import { ValidateLocationData } from "../../utils/locations";
import { useUserContext } from "../Contexts/UserContext";
import { useVehicleContext, VehicleProvider } from "../Contexts/VehicleContext";
import { VehiclePopUp } from "./popup";
import { useLocalStorage } from "../useLocalStorage";
import zoomLocations from './zoomLocations.json';
const Component = () => {
@@ -29,6 +30,7 @@ const Component = () => {
const [zoom, setZoom] = useState(2);
const [markers, setMarkers] = useState([]);
const [connections, setConnections] = useState({});
const [lastMapCenter, setLastMapCenter] = useLocalStorage("MAP_CENTER", "");
useEffect(() => {
if (!token) return;
@@ -62,10 +64,16 @@ const Component = () => {
};
const centerAroundMarkers = (points) => {
let defaultLocationJSON = process.env.REACT_APP_HOME_MAP_DEFAULT_LOCATION;
let defaultLocation = JSON.parse(defaultLocationJSON)
setCenter([defaultLocation.lat, defaultLocation.lng]);
setZoom(defaultLocation.zoom);
if (lastMapCenter) {
let zoomLocation = JSON.parse(lastMapCenter)
setCenter(zoomLocation.center);
setZoom(zoomLocation.zoom)
} else {
let defaultLocationJSON = process.env.REACT_APP_HOME_MAP_DEFAULT_LOCATION;
let defaultLocation = JSON.parse(defaultLocationJSON)
setCenter([defaultLocation.lat, defaultLocation.lng]);
setZoom(defaultLocation.zoom);
}
};
useEffect(() => {
@@ -105,6 +113,7 @@ const Component = () => {
};
const focusMap = (e) => {
setLastMapCenter(e.target.value)
let zoomLocation = JSON.parse(e.target.value)
setCenter(zoomLocation.center);
setZoom(zoomLocation.zoom)
@@ -145,7 +154,7 @@ const Component = () => {
return (
<>
<DropDownList label="Zoom To" data={zoomLocations} classes={classes} onChange={focusMap} />
<DropDownList label="Zoom To" data={zoomLocations} classes={classes} onChange={focusMap} value={lastMapCenter} />
<MapContainer
center={center}
zoom={zoom}

8
src/components/VehicleMap/zoomLocations.json
View File

@@ -4,15 +4,15 @@
"label": "North America"
},
{
"value": "{ \"center\": [33.8463, -118.0461], \"zoom\": 10 }",
"value": "{ \"center\": [33.8623, -118.0295], \"zoom\": 14 }",
"label": "- La Palma"
},
{
"value": "{ \"center\": [33.8847, -118.4109], \"zoom\": 10 }",
"value": "{ \"center\": [33.9021, -118.3792], \"zoom\": 14 }",
"label": "- Manhattan Beach"
},
{
"value": "{ \"center\": [37.7749, -122.4194], \"zoom\": 10 }",
"value": "{ \"center\": [37.7637, -122.4197], \"zoom\": 14 }",
"label": "- San Francisco"
},
{
@@ -20,7 +20,7 @@
"label": "Europe"
},
{
"value": "{ \"center\": [47.0707, 15.4395], \"zoom\": 10 }",
"value": "{ \"center\": [47.0221, 15.4774], \"zoom\": 14 }",
"label": "- Graz"
}
]