Skip to content

jinglebot/Neighborhood_Map

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

95 Commits
 
 
 
 
 
 
 
 

Repository files navigation

FRONTEND NANODEGREE NEIGHBORHOOD MAP PROJECT

A. What I did:

  1. do layout of location list and display

    • Bootstrap makes it easy
  2. create list <ul>, update to knockout

    • <ul> by knockout, map by js/jQuery
  3. add list filter functionality

    • use knockout data-bind
  4. create map display

    • should only be called once
  5. add markers

    • make markers as property of location object
  6. add markers filter functionality

    • use event listener
  7. get <li>s click functionality to link to open infowindow

    • use event listener
  8. add APIs

    • get oauth signature successfully
    • get results to display on page
  9. add hamburger menu functionality

  10. submit

B. Problems encountered:

  1. get Google map to display

    • get API key
  2. complete an array of locations to use

    • get at least 5 locations with title, address and lat/lng values
  3. determine how to filter the array

  4. put markers on the map

    • get markers to show using lat/lng values in the array

    • create markers in viewmodel

  5. determine how to filter the markers

  6. determine how to link <li>s with infowindow

  7. get APIs to show

    • which API to use -- Yelp

    • where to include API -- infowindows

  8. make sure there is separation of concerns in mvc style: model, view and viewmodel

  9. 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:

  1. Download or fork the application from: [https://github.com/jinglebot/Neighborhood_Map/tree/master]
  2. Click the Settings button to get to Settings Page.
  3. Under Github Pages, click the Your site is published at [https://jinglebot.github.io/Neighborhood_Map/] .
  4. Use filter box to filter both the list items and the map markers.
  5. Select a list item or map marker to open an info window describing the marker.