https://stanley-wallacelaw.com/wp-content/themes/stanley-theme/js/google-maps.js?ver=0.1

1// JavaScript Document
2
3(function($) {
4
5/*
6
7*  render_map
8
9*
10
11*  This function will render a Google Map onto the selected jQuery element
12
13*
14
15*  @type	function
16
17*  @date	8/11/2013
18
19*  @since	4.3.0
20
21*
22
23*  @param	$el (jQuery element)
24
25*  @return	n/a
26
27*/
28
29function render_map( $el ) {
30
31	// var
32
33	var $markers = $el.find('.marker');
34
35	// vars
36
37	var args = {
38
39		zoom		: 16,
40
41		center		: new google.maps.LatLng(0, 0),
42
43		mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'tehgrayz']
44
45	};
46
47	// create map	        	
48
49	var map = new google.maps.Map( $el[0], args);
50
51	// add a markers reference
52
53	map.markers = [];
54
55	// add markers
56
57	$markers.each(function(){
58
59    	add_marker( $(this), map );
60
61	});
62
63	// center map
64
65	center_map( map );
66
67var stylez = [
68	    {
69	      featureType: "all",
70	      elementType: "all",
71	      stylers: [
72	        { saturation: -100 } // <-- THIS
73	      ]
74	    }
75	];
76
77var mapType = new google.maps.StyledMapType(stylez, { name:"Grayscale" });
78map.mapTypes.set('tehgrayz', mapType);
79map.setMapTypeId('tehgrayz');
80
81}
82
83/*
84
85*  add_marker
86
87*
88
89*  This function will add a marker to the selected Google Map
90
91*
92
93*  @type	function
94
95*  @date	8/11/2013
96
97*  @since	4.3.0
98
99*
100
101*  @param	$marker (jQuery element)
102
103*  @param	map (Google Map object)
104
105*  @return	n/a
106
107*/
108
109function add_marker( $marker, map ) {
110
111	// var
112
113	var latlng = new google.maps.LatLng( $marker.attr('data-lat'), $marker.attr('data-lng') );
114
115	// create marker
116	//var image = 'http://dev.mobilewebsitepro.com/plasterland/wp-content/themes/plasterland/assets/images/marker-old.png';
117	var marker = new google.maps.Marker({
118		position	: latlng,
119		map			: map,
120		//icon : image
121
122	});
123
124	// add to array
125
126	map.markers.push( marker );
127
128	// if marker contains HTML, add it to an infoWindow
129
130	if( $marker.html() )
131
132	{
133
134		// create info window
135
136		var infowindow = new google.maps.InfoWindow({
137
138			content		: $marker.html()
139
140		});
141
142		// show info window when marker is clicked
143
144		google.maps.event.addListener(marker, 'click', function() {
145
146			infowindow.open( map, marker );
147
148		});
149
150	}
151
152}
153
154/*
155
156*  center_map
157
158*
159
160*  This function will center the map, showing all markers attached to this map
161
162*
163
164*  @type	function
165
166*  @date	8/11/2013
167
168*  @since	4.3.0
169
170*
171
172*  @param	map (Google Map object)
173
174*  @return	n/a
175
176*/
177
178function center_map( map ) {
179
180	// vars
181
182	var bounds = new google.maps.LatLngBounds();
183
184	// loop through all markers and create bounds
185
186	$.each( map.markers, function( i, marker ){
187
188		var latlng = new google.maps.LatLng( marker.position.lat(), marker.position.lng() );
189
190		bounds.extend( latlng );
191
192	});
193
194	// only 1 marker?
195
196	if( map.markers.length == 1 )
197
198	{
199
200		// set center of map
201
202	    map.setCenter( bounds.getCenter() );
203
204	    map.setZoom( 16 );
205
206	}
207
208	else
209
210	{
211
212		// fit to bounds
213
214		map.fitBounds( bounds );
215
216	}
217
218}
219
220/*
221
222*  document ready
223
224*
225
226*  This function will render each map when the document is ready (page has loaded)
227
228*
229
230*  @type	function
231
232*  @date	8/11/2013
233
234*  @since	5.0.0
235
236*
237
238*  @param	n/a
239
240*  @return	n/a
241
242*/
243
244$(document).ready(function(){
245
246	$('.acf-map').each(function(){
247
248		render_map( $(this) );
249
250	});
251
252});
253
254})(jQuery);