expanded-map-zoom-demo

1import { LocationMap } from "@/registry/default/ui/expanded-map";
2 
3export default function ExpandedMapZoomDemo() {
4  return (
5    <div className="flex flex-wrap items-center justify-center gap-8 p-12">
6      <div className="flex flex-col items-center gap-2">
7        <LocationMap
8          location="Sydney, Australia"
9          latitude={-33.8688}
10          longitude={151.2093}
11          zoom={10}
12        />
13        <span className="text-muted-foreground text-xs">Zoom: 10</span>
14      </div>
15      <div className="flex flex-col items-center gap-2">
16        <LocationMap
17          location="Sydney, Australia"
18          latitude={-33.8688}
19          longitude={151.2093}
20          zoom={14}
21        />
22        <span className="text-muted-foreground text-xs">Zoom: 14</span>
23      </div>
24      <div className="flex flex-col items-center gap-2">
25        <LocationMap
26          location="Sydney, Australia"
27          latitude={-33.8688}
28          longitude={151.2093}
29          zoom={17}
30        />
31        <span className="text-muted-foreground text-xs">Zoom: 17</span>
32      </div>
33    </div>
34  );
35}