NeighbourhoodMap

Udacity Full Stack Nano Degree Project 5

The fourthproject of the Udacity Full Stack Web Developer Nanodegree Program called "Build a Neighbourhood Map using Google API's".

Table Of Contents

• LiveDemo
• Download
• Knowledge Requirements
• Running Documents Locally
• Output
• References
• Bug And Feature Requests

LiveDemo

for Live Demo click here

Download

The files for the project, download.

What's included

Within the download you'll find the following directories and files:

NeighbourhoodMap-master.zip/
|
└── css
|     |
|     └── header.css  
|     └── styles.css  
|
└──  js
|     |
|     └── maps.js
|     └── header.js
|     └── data.js
|
└── NeighbourhoodMap.html
|
└── README.md

Knowledge-Requirements

• HTML
• CSS
• JS
• Ajax
• KnockOut-JS
• Google-API
• FourSquare-API

KnockOut-JS

• knockout.js helps you simplify dynamic JavaScript UIs using the Model-View-ViewModel (MVVM) pattern.
• for more information Online.

FourSquare-API

• Foursquare is a technology company that uses location intelligence to build meaningful consumer experiences and business solutions.
• Foursquare offers hosted technology and data to build context-smart, location-aware apps. Places by Foursquare technology powers location data for Apple, Uber, Twitter, Microsoft, Samsung and 100,000 other developers.
• use clientId ,secretId to get location information by pasing latitude and longitude.you can see in maps.js.
• for more information online.

Google-API

• Google providing different types of facilites.API's one.
• These API used for Developing Perposes.
• The Maps JavaScript API lets you customize maps with your own content and imagery for display on web pages and mobile devices.
• The Maps JavaScript API features four basic map types (roadmap, satellite, hybrid, and terrain) which you can modify using layers and styles, controls and events, and various services and libraries.
• Inthis project i used googlemapJs API check here

Running Documents Locally

• if want to Add your favourite places, then Open Data.js and Add.
• check Network connection and Open NeighbourhoodMap.html in Browser.
• After that, To searching for Location, Click on Hamburger Button on top-left.
• To close click on X mark.
• Output Looks like this.

Output

Default View

Click On Marker

Click On Hamburger Button

Searching

References

• Stack overflow to errors retriving.
• FourSquare API online.
• Google MapsJS API Online.
• KnockOut JS Online.

---

Bug And Feature Requests

• Have a bug or a feature request? Please feel free to open an issue.