🗺️ Anaxi Mapper
, or Anaxi
for short, is a web application utilizing Google's map and WebGL map API's to provide an interactive, 3d user experience. 🗺️
Users can navigate to addresses or cities and create search parameters to locate places of interest nearby, which will generate an overlay of 3d models and markers for ease of viewing! From there, users can also comment on and/or favorite their search results to share with others or simply review again in future visits!
First time users need to sign up with an account to access the application; existing users may login using their credentials from the login page.
A default location and overlay will appear on the map. Under the map, there are two rows of search bars. The upper search bar is an address or city search, which will navigate the map to the desired location. The lower 3 search bars are a set of parameters for the nearby search, with the parameters being radius (in km), type (restaurants, gyms, etc), and keyword (eg. type: restaurant, keyword: sushi ). Once a nearby search is submitted in the desired starting address, the map will rerender with a new overlay containing markers and information on locations fulfilling the search parameters! Under the search section, there is a list display of these locations as well, where users can add comments and favorite these results. To revisit past favorites, users can use the favorites list on the bottom right, which will hold all of the favorites saved onto their account.
Frontend: Typescript, Vite, ReactJS, TailwindCSS, Jotai, Threejs
Backend: Javascript, MongoDB, Mongoose ODM, Express, Node, JWT, REST Api
Other: Heroku, Google Maps Platform (Maps JS, Geocoding, Places, WebGL Overlay)
To run this application locally, first clone this repository.
Then, install the necessary dependencies.
npm i
Add a .env file in client
with your credentials.
VITE_APIKEY=<your-api-key>
Add a .env file in server
with your credentials.
apiKey=<your-api-key>
Navigate to this repository's root directory and run the following to start the application.
npm run develop
Your server will be hosted at http://localhost:5173
.
Note: This application utilizes a MongoDB database. You will need to install MongoDB to run this application locally.
Contributors can submit changes by a new branch and creating a pull request. A pull request must have at least 1 approval before it can be merged into the main branch.
To request contributor status, please contact one of the creators below:
-
Routing Matrix
-
Travel Animations
-
User QOL improvements
Brandon Ly : Github & LinkedIn & Email
Logan Senn : Github & LinkedIn & Email
Mirjana Dukic : Github & LinkedIn & Email
Hannah Kim : Github & LinkedIn & Email
This project was the product of 4 highly ambitious and creative full stack developers to showcase our ability to develop stunning web applications. Feel free to email us with any questions, suggestions, or business inquiries!
Special thanks to:
Chad Tao : Github
Nick Graffis : Github
Low Poly Scooter by Qbo2Qbo licensed under CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)
Flag from Kay Lousberg at PMNDRS Market