🗺️ 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!

anaxi.app

Usage

Technologies Used

Local Installation

Contribution Guidelines

Developer Roadmap

Developers

Acknowledgements

Credits

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