diff --git a/src/app/(map)/layout.tsx b/src/app/(map)/layout.tsx
index 395ed10ea5e339d27d3fa0aab5dd34de31a9b981..254a46fb40e336f6af56d632f2aac3377e84b715 100644
--- a/src/app/(map)/layout.tsx
+++ b/src/app/(map)/layout.tsx
@@ -1,6 +1,6 @@
 'use client'
 
-import React, {useState} from "react";
+import React, {useMemo, useState} from "react";
 import {Sidebar, SidebarState, useSidebar, Button, Overlay} from "@rewind-ui/core";
 import Link from "next/link";
 import Image from "next/image";
@@ -79,6 +79,7 @@ export default function Layout({children}: {children: React.ReactNode}) {
                          </Button>
                      </header>
                  {children}
+
             </div>
         </div>
     );
diff --git a/src/app/(map)/page.tsx b/src/app/(map)/page.tsx
index d93a3d75e2ef5f08ab3d23644fa84126222c3a41..9b9f83cf24ea9343e94d7050f6334792264f564b 100644
--- a/src/app/(map)/page.tsx
+++ b/src/app/(map)/page.tsx
@@ -1,45 +1,66 @@
 'use client'
-import {Map, Marker, Popup } from 'react-map-gl/maplibre';
-import {useState} from "react";
+import {Map, Marker, Popup, NavigationControl, FullscreenControl, GeolocateControl, ScaleControl} from 'react-map-gl/maplibre';
+import React, {useMemo, useState} from "react";
 import 'maplibre-gl/dist/maplibre-gl.css';
-import Image from "next/image";
 import Link from "next/link";
+import BUILDINGS from "../buildings.json";
+import {Building} from "@/types/Building";
 
 export default function Page() {
-    const [popupInfo, setPopupInfo] = useState(null);
+    const [popupInfo, setPopupInfo] = useState<Building | null>(null);
+    const pins = useMemo(
+        () =>
+            BUILDINGS.buildings.map((building, index) => (
+                <Marker
+                    key={`marker-${index}`}
+                    latitude={building.coordinates.y}
+                    longitude={building.coordinates.x}
+                    anchor="bottom"
+                    onClick={e => {
+                        e.originalEvent.stopPropagation();
+                        setPopupInfo(building);
+                    }}
+                    color={"red"}
+                >
+                </Marker>
+            ))
+        ,
+        []
+    );
+
     return (
+        <div className="relative w-full h-full -z-10 flex flex-col items-center justify-center">
         <Map
             initialViewState={{
                 longitude: 37.41,
                 latitude: 55.80,
                 zoom: 5
             }}
-            style={{ position: 'absolute', width: '100%', overflow: 'hidden', zIndex: -1 }}
             mapStyle="https://api.maptiler.com/maps/basic-v2/style.json?key=x0lAUu1VgVmKqWWSMZRu"
         >
-            <Marker longitude={37.4101} latitude={55.8032} anchor="bottom" color={"red"} onClick={e => {
-                e.originalEvent.stopPropagation();
-                console.log(popupInfo);
-                setPopupInfo(true);
-            }}/>
-
+            <NavigationControl position="top-left"/>
+            <FullscreenControl position="top-left"/>
+            <GeolocateControl position="top-left"/>
+            <ScaleControl style={{borderWidth: '0px'}}/>
+            {pins}
             {popupInfo && (
                 <Popup
                     anchor="top"
-                    longitude={37.4101}
-                    latitude={55.8032}
+                    longitude={popupInfo.coordinates.x}
+                    latitude={popupInfo.coordinates.y}
                     onClose={() => setPopupInfo(null)}
                 >
                     <div>
-                        {"Институт"}, {"МИЭМ"} |{' '}
+                        {popupInfo.buildingType}, {`Статус - ${popupInfo.status}`} |{' '}
                         <Link href={'https://miem.hse.ru/'}>
-                        Сайт
+                        Панорама
                         </Link>
                     </div>
-                     <Image src={"/miem.png"} alt={"icon"} width={150} height={50} />
+
                 </Popup>
             )}
 
         </Map>
+        </div>
     );
 }
\ No newline at end of file
diff --git a/src/app/buildings.json b/src/app/buildings.json
new file mode 100644
index 0000000000000000000000000000000000000000..979f32b813c444cd543b84f76ab4b2e8bfd8ba68
--- /dev/null
+++ b/src/app/buildings.json
@@ -0,0 +1,108 @@
+{
+  "_id": "1",
+  "panoramId": "0",
+  "count": 10,
+  "buildings": [
+    {
+      "_id": "1",
+      "buildingType": "university",
+      "status": "using",
+      "floors": 15,
+      "material": "concrete",
+      "coordinates": {
+        "x": 37.4101,
+        "y": 55.8032
+      }
+    },{
+      "_id": "2",
+      "buildingType": "gym",
+      "status": "using",
+      "floors": 3,
+      "material": "concrete",
+      "coordinates": {
+        "x": 37.4113,
+        "y": 55.8044
+      }
+    },{
+      "_id": "3",
+      "buildingType": "house",
+      "status": "using",
+      "floors": 29,
+      "material": "concrete",
+      "coordinates": {
+        "x": 37.4121,
+        "y": 55.8024
+      }
+    },{
+      "_id": "4",
+      "buildingType": "house",
+      "status": "using",
+      "floors": 29,
+      "material": "concrete",
+      "coordinates": {
+        "x": 37.4130,
+        "y": 55.8030
+      }
+    },{
+      "_id": "5",
+      "buildingType": "house",
+      "status": "using",
+      "floors": 28,
+      "material": "concrete",
+      "coordinates": {
+        "x": 37.4134,
+        "y": 55.8036
+      }
+    },{
+      "_id": "6",
+      "buildingType": "house",
+      "status": "using",
+      "floors": 28,
+      "material": "concrete",
+      "coordinates": {
+        "x": 37.4132,
+        "y": 55.8044
+      }
+    },{
+      "_id": "7",
+      "buildingType": "school",
+      "status": "using",
+      "floors": 3,
+      "material": "concrete",
+      "coordinates": {
+        "x": 37.4137,
+        "y": 55.8041
+      }
+    },{
+      "_id": "8",
+      "buildingType": "house",
+      "status": "using",
+      "floors": 38,
+      "material": "concrete",
+      "coordinates": {
+        "x": 37.4145,
+        "y": 55.8044
+      }
+    },{
+      "_id": "9",
+      "buildingType": "mall",
+      "status": "using",
+      "floors": 2,
+      "material": "concrete",
+      "coordinates": {
+        "x": 37.4148,
+        "y": 55.8054
+      }
+    },{
+      "_id": "10",
+      "buildingType": "mall",
+      "status": "using",
+      "floors": 3,
+      "material": "concrete",
+      "coordinates": {
+        "x": 37.4134,
+        "y": 55.8056
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/src/types/Building.ts b/src/types/Building.ts
new file mode 100644
index 0000000000000000000000000000000000000000..387141607e135b66952bde10228905a4b08fad0e
--- /dev/null
+++ b/src/types/Building.ts
@@ -0,0 +1,13 @@
+type Coordinate = {
+    x: number;
+    y: number;
+}
+
+export type Building = {
+    _id: string;
+    buildingType: string;
+    status: string;
+    floors: number;
+    material: string;
+    coordinates: Coordinate;
+}
\ No newline at end of file