Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/rakannimer/google-maps-js-example

An app that uses many features (Places autocomplete-Geocoding-Overlays[rectangles-circles-markers-custom markers]-DirectionsService-DirectionsRenderer ) of the Google Maps V3 javascript library. Aiming to be a starting point and reference to getting started with Google Maps API.
https://github.com/rakannimer/google-maps-js-example

Last synced: 15 days ago
JSON representation

An app that uses many features (Places autocomplete-Geocoding-Overlays[rectangles-circles-markers-custom markers]-DirectionsService-DirectionsRenderer ) of the Google Maps V3 javascript library. Aiming to be a starting point and reference to getting started with Google Maps API.

Awesome Lists containing this project

README

        

Google-Maps-JS-Example
======================

An app that uses many features (Places autocomplete-Geocoding-Overlays[rectangles-circles-markers-custom markers]-DirectionsService-DirectionsRenderer ) of the Google Maps V3 javascript library. Aiming to be a starting point and reference to getting started with Google Maps API.

Getting Started
---------------

Download the code and open Map.html in your favorite browser.
That's it.
You will see the things that you can easily do with the Google Maps API and some minimal jQuery UI if you're not design oriented.
The functionality is not important think of it as a showcase for Google Maps features.

Using the code to build stuff with Google Maps
----------------------------------------------

[Fork](https://help.github.com/articles/fork-a-repo) the repo, make it better for other people to use.

Use it for your business, for your fun project remove the code you don't need. Add the features you do need.
And tell me about it if you want so I can put a link to your website here as a testament to cool things that can be done with maps.

Features
--------------

Introductory Deck : http://slid.es/rakannimer/building-an-app-with-google-maps

Use the autocomplete searchbox to center map on a given city or address.

Draw a rectangle by clicking on the rectangle in the toolbox, drawing the rectangle then double clicking to confirm drawing

Same goes for circles

Set a passenger on the map by clicking on the person icon, double click on the person then set the destination of this person by dragging the new person that appeared.
Double click the person and a path between them will be drawn

Simple polyline and polygon drawing is provided on the top of the screen

The code in the event handler is documented well.