A. What I did:
-
do layout of location list and display
- Bootstrap makes it easy
-
create list
<ul>
, update to knockout<ul>
by knockout, map by js/jQuery
-
add list filter functionality
- use knockout data-bind
-
create map display
- should only be called once
-
add markers
- make markers as property of location object
-
add markers filter functionality
- use event listener
-
get
<li>
s click functionality to link to open infowindow- use event listener
-
add APIs
- get oauth signature successfully
- get results to display on page
-
add hamburger menu functionality
-
submit
B. Problems encountered:
-
get Google map to display
- get API key
-
complete an array of locations to use
- get at least 5 locations with title, address and lat/lng values
-
determine how to filter the array
-
put markers on the map
-
get markers to show using lat/lng values in the array
-
create markers in viewmodel
-
-
determine how to filter the markers
-
determine how to link
<li>
s with infowindow -
get APIs to show
-
which API to use -- Yelp
-
where to include API -- infowindows
-
-
make sure there is separation of concerns in mvc style: model, view and viewmodel
-
how to place error catch
C. How to access my project
Visit my project: [Numismatic Guide to LA] (https://github.com/jinglebot/Neighborhood_Map)
Or:
- Download or fork the application from: [https://github.com/jinglebot/Neighborhood_Map/tree/master]
- Click the Settings button to get to Settings Page.
- Under Github Pages, click the Your site is published at [https://jinglebot.github.io/Neighborhood_Map/] .
- Use filter box to filter both the list items and the map markers.
- Select a list item or map marker to open an info window describing the marker.