===============================
Made for the Udacity Frontend-Nanodegree, in this project you will see a map of Augsburg (Bavaria, Germany). This map is included via the Google Maps API. Important or interesting places are marked. Functionality includes clickable markers with content from wikipedia matching to the locations and a search function for filtering the places (and markers).
- Download the project on Github: Augsburg Map Project
OR
- See the result on Github Pages
- Open the index.html in your local webserver
OR
- Click on my Github Pages Website
- Knockout JS
- Google Maps API
- Wikipedia API
- jQuery
- Sass (compiled via Prepros)
As you can see, depending on your device, there is a search bar on the right hand side or - on small (mobile) screens - on the bottom of the page. With this search, it is possible to filter the shown markers as well as the results in the search box.
On click, the markers will animate (bounce) and an info window opens. In the info window is shown what is located there (for example town hall Augsburg) and also three related articles which you can find on wikipedia. The content is automatically filled via the wikipedia API. So it is possible for you to automatically get the best fitting results depending on the location you are looking for and straight get to the matching wikipedia article just by clicking on them.
The application is designed to work responsive. Therefore you can use it on mobile devices as well as on big screens.
MIT