james-r2
10/9/2015 - 6:16 AM

Google Maps JS

Google Maps JS

$(document).ready(function() {

	Site.init();
	Site.map();

});


var Site = {
	init: function() {
		
				
		$('.slider').flexslider({
			animation:		 'slide',
			directionNav:	 false,
			controlNav:		 true
		});
		
		
	},
	
	
	map: function() {
		
		var map;
		var markers = [];
		var mapCenter = new google.maps.LatLng(-33.872657, 151.208229);
		
		var MY_MAPTYPE_ID = 'custom_style';
		
		function initialize() {	
		  
		  	var featureOpts = [{"featureType":"all","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"administrative","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"landscape.man_made","elementType":"all","stylers":[{"color":"#bcced7"}]},{"featureType":"landscape.natural","elementType":"geometry.fill","stylers":[{"visibility":"on"},{"color":"#e0efef"}]},{"featureType":"landscape.natural.landcover","elementType":"all","stylers":[{"color":"#bcced7"}]},{"featureType":"poi","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"poi","elementType":"geometry.fill","stylers":[{"visibility":"on"},{"hue":"#1900ff"},{"color":"#c0e8e8"}]},{"featureType":"poi.attraction","elementType":"all","stylers":[{"visibility":"simplified"},{"color":"#ffffff"}]},{"featureType":"poi.attraction","elementType":"geometry","stylers":[{"color":"#ffffff"}]},{"featureType":"poi.attraction","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"poi.attraction","elementType":"labels.text.fill","stylers":[{"color":"#ffffff"}]},{"featureType":"poi.attraction","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"poi.business","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"poi.business","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"poi.government","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"poi.government","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"poi.medical","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"poi.medical","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"poi.park","elementType":"geometry","stylers":[{"color":"#dce6b3"}]},{"featureType":"poi.place_of_worship","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"poi.school","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"poi.sports_complex","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"road","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"road","elementType":"geometry","stylers":[{"lightness":100},{"visibility":"simplified"}]},{"featureType":"road","elementType":"labels","stylers":[{"visibility":"simplified"},{"color":"#6a6a6a"}]},{"featureType":"road","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"road.highway","elementType":"geometry","stylers":[{"visibility":"on"},{"color":"#ffffff"}]},{"featureType":"road.highway","elementType":"labels","stylers":[{"visibility":"on"}]},{"featureType":"road.highway","elementType":"labels.text.stroke","stylers":[{"visibility":"off"}]},{"featureType":"road.highway","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"road.highway.controlled_access","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"road.highway.controlled_access","elementType":"labels.text.fill","stylers":[{"visibility":"on"}]},{"featureType":"road.highway.controlled_access","elementType":"labels.text.stroke","stylers":[{"visibility":"off"}]},{"featureType":"road.highway.controlled_access","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"transit","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"transit.line","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"transit.line","elementType":"geometry","stylers":[{"visibility":"off"},{"lightness":700}]},{"featureType":"transit.line","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"all","stylers":[{"color":"#dbf0fc"},{"visibility":"on"}]}];

		
			var mapOptions = {
			    zoom: 16,
			    center: mapCenter,   
			    mapTypeControlOptions: { mapTypeIds: [google.maps.MapTypeId.ROADMAP, MY_MAPTYPE_ID] },
			    mapTypeId: MY_MAPTYPE_ID,
			    scrollwheel: false,
			    streetViewControl: false,
			    mapTypeControl: false,
			    zoomControl: true,
			    draggable: false,
			};
			
			map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
			
			var styledMapOptions = {
			    name: 'Custom Style'
			};
		
			var customMapType = new google.maps.StyledMapType(featureOpts, styledMapOptions);  
		  
			map.mapTypes.set(MY_MAPTYPE_ID, customMapType);
		  
		  // creates an all of one point  
		  mapPoint = [{
			    "name":"Colliers 175 Castlereagh",
			    "map_lat":"-33.872657",
			    "map_lng":"151.208229",
			}];
			
			// to create multiple points pass a JSON array width at least the 3 main fields

		    setMarkers(map, mapPoint);
			
		}
		//end initialize
		
		
		var mapMarker = {
		    url: '/img/map-marker.png',
		    // This marker is 20 pixels wide by 32 pixels tall.
		    size: new google.maps.Size(42, 42),
		    // The origin for this image is 0,0.
		    origin: new google.maps.Point(0,0),
		    // The anchor for this image is the base of the flagpole at 0,32.
		    anchor: new google.maps.Point(0, 21),
		    // make the marker icon retina
		    scaledSize: new google.maps.Size(42, 42),
		};

		
		function setMarkers(map, locations) {
		  // Add markers to the map
		
		  // Origins, anchor positions and coordinates of the marker
		  // increase in the X direction to the right and in
		  // the Y direction down.
		
		  for (var i = 0; i < locations.length; i++) {
		    var loc = locations[i];
		    		
		    var myLatLng = new google.maps.LatLng(loc.map_lat, loc.map_lng);
		    var marker = new google.maps.Marker({
		        position: myLatLng,
		        map: map,
		        icon: mapMarker,
		        title: loc.name,
		        labelContent: loc.name,
		        labelClass: "labels"
		    });
		    
		    markers.push(marker);
		    
		  }
		}
		
		google.maps.event.addDomListener(window, 'load', initialize);
		
		google.maps.event.addDomListener(window, "resize", function() {
			 var center = map.getCenter();
			 google.maps.event.trigger(map, "resize");
			 map.setCenter(center); 
		});
	
	}
	
	
}