Last active
August 29, 2015 14:20
-
-
Save Cerealkillerway/d424994c905a6a17ca97 to your computer and use it in GitHub Desktop.
Google maps javascript APIs V3 snippets
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// GOOGLE MAPS JS API V3 | |
//creates a google map in #mapCanvas DOM element | |
var coordinates = { | |
lat: 15.1564541, | |
lng: 9.456456 | |
} | |
function createMap(coordinates) { | |
//google map | |
var mapOptions = { | |
scrollwheel: false, //disable zoom on mouse wheel | |
zoom: 13, | |
center: coordinates, | |
disableDefaultUI: true, | |
}; | |
var map = new google.maps.Map(document.getElementById('mapCanvas'), mapOptions); | |
return map; | |
} | |
//creates a marker on the map | |
function setMarker(coordinates, map) { | |
var marker = new google.maps.Marker({ | |
position: coordinates, | |
map: map, //map object | |
icon: { | |
url:'/images/icons/markers/marker-1.png', | |
size: new google.maps.Size(50, 50), | |
}, | |
title: 'Marker title', | |
draggable: true //makes the marker draggable on the map | |
}); | |
} | |
//if a marker is draggable, adds a listener to get its coordinates | |
google.maps.event.addListener(marker, 'dragend', function(event) { | |
var markerCoordinates = { | |
lat: event.latLng.lat(), | |
lng: event.latLng.lng() | |
} | |
//use markerCoordinates to do your stuff... | |
}); | |
//creates an info window on the map | |
//and add an event listener to open it on click on a specific marker | |
function setInfoWindow(map, marker, infoText) { | |
var infowindow = new google.maps.InfoWindow({ | |
content: infoText, | |
}); | |
google.maps.event.addListener(marker, 'click', function() { | |
infowindow.open(map, marker); | |
}); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment