diff --git a/.github/screenshot.png b/.github/screenshot.png new file mode 100644 index 0000000..7ec8a86 Binary files /dev/null and b/.github/screenshot.png differ diff --git a/README.md b/README.md index f57574a..0ca0b5f 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,23 @@ -# map3d +![img](./.github/screenshot.png) -Generate a real world 3D map +

+

🗺️ map3d

+

Generate a real world 3D map

+

+ +

+Visit · Report Bugs +

+ +## About The Project + +This is a 3D building mapping service implemented with [React-Three-Fiber](https://github.com/pmndrs/react-three-fiber). It allows exporting as a GLB file, and all features are free to use. Based on this project, various functionalities such as **digital twin**, **drone surveying**, and **GPS markers** can be implemented. + +The map files are based on OpenStreetMap data. + +## Roadmap + +- [x] Export GLB +- [ ] Building Texture +- [ ] Height Customization +- [ ] Material diff --git a/src/components/map/SelectMap.tsx b/src/components/map/SelectMap.tsx index 0e58d4c..714ab38 100644 --- a/src/components/map/SelectMap.tsx +++ b/src/components/map/SelectMap.tsx @@ -37,6 +37,7 @@ function RectangleSelector({ const map = useMapEvents({ mousedown(e) { if (isDrag == false) { + console.log(e); setFirstPoint(e.latlng); } }, @@ -151,7 +152,7 @@ export function MapComponent({ ((set) => ({ areas: [], center: [ { - lat: 36.48888914657037, - lng: 127.26794242858888, + lat: 40.8, + lng: -73.95, }, { - lat: 36.48023136458878, - lng: 127.25330829620363, + lat: 40.83, + lng: -73.88, }, ], appendAreas: (areas) => set(() => ({ areas: [...areas] })),