Mysaa/Encartes-web
1
0
Fork 0
mirror of https://gitlab.aliens-lyon.fr/encartes/web-interface.git synced 2026-03-18 23:21:05 +01:00
Code Issues Packages Projects Releases Wiki Activity

Menu next to the map

Browse Source
This commit is contained in:
Adrien Vannson 2022-10-06 14:15:34 +02:00
parent b040aedb88
commit c5e35565e9
No known key found for this signature in database
GPG Key ID: FE2E66FD978C1A55
1 changed files with 16 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
src/App.js
View File

@ -11,10 +11,8 @@ import DialogActions from '@mui/material/DialogActions';
import DialogContent from '@mui/material/DialogContent'; import DialogContent from '@mui/material/DialogContent';
import DialogContentText from '@mui/material/DialogContentText'; import DialogContentText from '@mui/material/DialogContentText';
import DialogTitle from '@mui/material/DialogTitle'; import DialogTitle from '@mui/material/DialogTitle';
import Grid from '@mui/material/Grid';
import { ComposableMap, Geographies, Geography, ZoomableGroup } from "react-simple-maps" import { ComposableMap, Geographies, Geography, ZoomableGroup } from "react-simple-maps"
import { autocompleteClasses } from '@mui/material';
function RoomResearch() { function RoomResearch() {
return <> return <>
@ -47,18 +45,16 @@ function TopBar() {
}; };
return <> return <>
<Box sx={{ flexGrow: 1 }}> <AppBar position="static">
<AppBar position="static"> <Toolbar>
<Toolbar> <Typography variant="h6" component="div" sx={{ flexGrow: 1 }}>
<Typography variant="h6" component="div" sx={{ flexGrow: 1 }}> ENcarteS
ENcarteS </Typography>
</Typography> <Button color="inherit">Choix d'une carte</Button>
<Button color="inherit">Choix d'une carte</Button> <Button color="inherit">Recherche d'une salle</Button>
<Button color="inherit">Recherche d'une salle</Button> <Button color="inherit" onClick={handleOpenAboutModal}>À propos</Button>
<Button color="inherit" onClick={handleOpenAboutModal}>À propos</Button> </Toolbar>
</Toolbar> </AppBar>
</AppBar>
</Box>
<Dialog <Dialog
open={openAboutModal} open={openAboutModal}
@ -83,10 +79,9 @@ function TopBar() {
function Map() { function Map() {
const geoUrl = "https://raw.githubusercontent.com/deldersveld/topojson/master/world-countries.json"; const geoUrl = "https://raw.githubusercontent.com/deldersveld/topojson/master/world-countries.json";
// <Box height='100%' border='1px solid red'>
return ( return (
<ComposableMap style={{ height: "100%", width: '100%' }} > <ComposableMap>
<ZoomableGroup center={[0, 0]} zoom={9}> <ZoomableGroup center={[0, -20]} zoom={1}>
<Geographies geography={geoUrl}> <Geographies geography={geoUrl}>
{({ geographies }) => {({ geographies }) =>
geographies.map((geo) => ( geographies.map((geo) => (
@ -103,16 +98,11 @@ function Map() {
export default function App() { export default function App() {
return <> return <>
<TopBar /> <TopBar />
<Map />
{/*<Box height="100vh" display="flex" flexDirection="column"> <div style={{ display: 'flex', flex: 1, flexDirection: 'line' }}>
<Box>Filter</Box> <Map />
<Box flex={1} overflow="auto"> <RoomResearch />
{Array.from(Array(100)).map((v, i) => ( </div>
<div key={i}>Testing {i}</div>
))}
</Box>
</Box>*/}
</> </>
} }