</div>
<div class="row">
<div id="member-breweries" class="small-12 large-8 columns no-float">
- <div id="LeafletMapContainer"></div>
<?php echo do_shortcode('[glm-members-list category="23" view="no-map"]'); ?>
</div>
</div>
<?php $url = get_stylesheet_directory_uri(). '/assets/markers/'; ?>
-<?php $plugin_url = plugin_dir_url('glm-member-db') . 'glm-member-db/js'; ?>
-<!-- <script src="https://maps.googleapis.com/maps/api/js?place=Kalamazoo,+MI&key=AIzaSyCBFqeBtlAGoVcpFBa5Ldrb1QajYnbCrac&callback=initMap&libraries=geometry" async="" defer=""></script> -->
-
-<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.3/dist/leaflet.css" integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ==" crossorigin=""/>
-<script src="https://unpkg.com/leaflet@1.3.3/dist/leaflet.js" integrity="sha512-tAGcCfR4Sc5ZP5ZoVz0quoZDYX5aCtEm/eu1KhSLj2c9eFrylXZknQYmxUssFaVJKvvc0dJQixhGjG2yXWiV9Q==" crossorigin=""></script>
-<link rel="stylesheet" href="<?php echo $plugin_url; ?>/LeafletMarkerCluster/dist/MarkerCluster.Default.css" />
-<script src="<?php echo $plugin_url; ?>/LeafletMarkerCluster/dist/leaflet.markercluster-src.js"></script>
-<link rel="stylesheet" href="<?php echo $plugin_url; ?>/Leaflet.loading/src/Control.Loading.css" />
-<script src="<?php echo $plugin_url; ?>/Leaflet.loading/src/Control.Loading.js"></script>
-<script src="<?php echo get_template_directory_uri(); ?>/js/leaflet.geometryutil.js"></script>
<script>
- var leafletMap;
+ var map;
function initMap() {
-
- // var distancePath = new google.maps.Polyline();
-
// Styles a map in night mode.
var url = '<?php echo $url ?>';
- leafletMap = L.map('brewery-map', {
- center: [42.2903325, -85.5853277],
- zoom: 14
- });
- var leafletTileServer = 'https://maps.gaslightmedia.com/08172018-4c95c314f0934e680190f27ef99c6dcc/{z}/{x}/{y}.png';
- var leafletMinZoom = 3;
- var leafletMaxZoom = 19;
-
-
- // Loading features
- // var loadingControl = L.Control.loading({
- // separate: true,
- // delayIndicator: 500
- // });
- // leafletMap.addControl(loadingControl);
-
- // Init Map
- L.tileLayer(leafletTileServer, {
- attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.gaslightmedia.com/">Gaslight Media</a>',
- minZoom: leafletMinZoom,
- maxZoom: leafletMaxZoom,
- id: 'nothot'
- }).addTo(leafletMap);
- // add border around the downtown coordinates
+ map = new google.maps.Map(document.getElementById('brewery-map'), {
+ center: {lat: 42.2903325, lng: -85.5853277 },
+ zoom: 14,
+ styles: [
+ {
+ "featureType": "administrative.neighborhood",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#a3a470"
+ }
+ ]
+ },
+ {
+ "featureType": "landscape.man_made",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#eec081"
+ }
+ ]
+ },
+ {
+ "featureType": "landscape.natural",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#eec081"
+ }
+ ]
+ },
+ {
+ "featureType": "landscape.natural.landcover",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#eec081"
+ }
+ ]
+ },
+ {
+ "featureType": "landscape.natural.terrain",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#eec081"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.attraction",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.attraction",
+ "elementType": "geometry.stroke",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.business",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.business",
+ "elementType": "geometry.stroke",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.government",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.government",
+ "elementType": "geometry.stroke",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.medical",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.medical",
+ "elementType": "geometry.stroke",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.park",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#a3a470"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.place_of_worship",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.place_of_worship",
+ "elementType": "geometry.stroke",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.school",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#a3a470"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.school",
+ "elementType": "geometry.stroke",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "poi.sports_complex",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#bb8f63"
+ }
+ ]
+ },
+ {
+ "featureType": "road.highway",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#ffffff"
+ }
+ ]
+ },
+ {
+ "featureType": "road.highway",
+ "elementType": "geometry.stroke",
+ "stylers": [
+ {
+ "color": "#ffffff"
+ }
+ ]
+ },
+ {
+ "featureType": "transit.line",
+ "elementType": "geometry.stroke",
+ "stylers": [
+ {
+ "color": "#9b321b"
+ }
+ ]
+ },
+ {
+ "featureType": "water",
+ "elementType": "geometry.fill",
+ "stylers": [
+ {
+ "color": "#728890"
+ }
+ ]
+ }
+ ]
+ });
var downtown = [
- [42.295482, -85.578543],
- [42.294493, -85.590343],
- [ 42.288731, -85.597809],
- [ 42.288811, -85.579227],
- [ 42.295482, -85.578543],
+ {lat: 42.295482, lng: -85.578543},
+ {lat: 42.294493, lng: -85.590343},
+ {lat: 42.288731, lng: -85.597809},
+ {lat: 42.288811, lng: -85.579227},
+ {lat: 42.295482, lng: -85.578543},
];
- var polyline = L.polyline(downtown, {color: '#91311D', weight: 2}).addTo(leafletMap);
+ var poly = new google.maps.Polyline({
+ path:downtown,
+ strokeColor: '#91311D',
+ strokeOpacity: 2.0,
+ strokeWeight:2,
+ map:map
+ });
+ poly.setMap(map);
+ var distancePath = new google.maps.Polyline();
+ function drawLine(point1, point2) {
+
+ var coordinates = [point1,point2];
- // markers for each of the breweries
- var brewers = [
- {
- position: [42.295573, -85.571195],
- brewery: 'Arcadia Brewing Co',
- address: '701 E Michigan Ave, Kalamazoo, MI 49007',
- contact: '(269) 276-0458',
- website: "http://arcadiaales.com/",
- icon: 'arcadia.png',
-
- }, {
- position: [42.2947, -85.5789],
- brewery: "Bell’s Eccentric Cafe",
- address: '355 E Kalamazoo Ave, Kalamazoo, MI 49007',
- contact: '(269) 382-2332',
- website: 'https://www.bellsbeer.com/',
- icon: 'bells.png',
- }, {
- position: [42.291180, -85.589856],
- brewery: 'Gonzo’s BiggDog Brewing',
- address: '140 S Westnedge Ave, Kalamazoo, MI 49007',
- contact: '(269) 382-2739',
- website: 'http://gonzosbiggdoggbrewing.com/',
- icon: 'gonzo.png'
- }, {
- position: [42.291812, -85.581529],
- brewery: 'Olde Peninsula Brewpub',
- address: '200 E Michigan Ave, Kalamazoo, MI 49007',
- contact: '(269) 343-2739',
- website: 'http://oldepenkazoo.com/',
- icon: 'olde.png'
- }, {
- position: [42.290428, -85.594139],
- brewery: 'Rupert’s Brew House',
- address: '773 W Michigan Ave, Kalamazoo, MI 49007',
- contact: '(269) 337-9911',
- website: 'http://www.rupertsbrewhouse.com/',
- icon: 'rupert.png'
- }, {
- position: [42.288456, -85.583898],
- brewery: 'Tibbs Brewing Co.',
- address: '402 S Burdick St, Kalamazoo, MI 49007',
- contact: '(877) 762-7397',
- website: 'http://tibbsbrewing.com/',
- icon: 'tibbs.png'
- }, {
- position: [42.302854, -85.577619],
- brewery: 'Boatyard Brewing Co',
- address: '432 E Paterson St, Kalamazoo, MI 49009',
- contact: '(269) 226-0300',
- website: 'https://boatyardbrewing.com/',
- icon: 'boatyard.png'
- }, {
- position: [42.281642, -85.582770],
- brewery: 'Brite Eyes Brewing',
- address: '1156 S Burdick St A, Kalamazoo, MI 49001',
- contact: '(269) 220-5001',
- website: 'http://briteeyesbrewingco.com/',
- icon: 'brite.png'
- }, {
- position: [42.205118, -85.560470],
- brewery: 'Latitude 42 Brewing Co.',
- address: '7842 Portage Rd, Portage, MI 49002',
- contact: '(269) 459-4242',
- website: 'https://latitude42brewingco.com/',
- icon: 'latitude.png'
- }, {
- position: [42.248718, -85.559042],
- brewery: 'One Well Brewing',
- address: '4213 Portage Street, Kalamazoo, MI 49001',
- contact: '(269) 459-9240',
- website: 'http://onewellbrewing.com/',
- icon: 'one.png'
- }, {
- position: [42.204832, -85.686902],
- brewery: 'Texas Corners Brewery',
- address: '6970 Texas Dr, Kalamazoo, MI 49009',
- contact: '(269) 870-7724',
- website: 'http://texascornersbrewing.com/',
- icon: 'texas.png'
- }, {
- position: [42.121430, -85.533167],
- brewery: 'Distant Whistle Brewhouse',
- address: '118 S Main St, Vicksburg, MI 49097',
- contact: '(269) 475-5447',
- website: 'http://www.distantwhistle.com/',
- icon: 'distant.png'
- }, {
- position: [42.2716, -85.6307],
- brewery: 'Bilbo’s Pizza in a Pan',
- address: '3307 Stadium Dr, Kalamazoo, MI 49008',
- contact: '(269) 382-5544',
- website: 'http://www.bilbospizza.com/',
- icon: 'bilbos.png'
- }, {
- position: [42.239304, -85.560769],
- brewery: 'Bravo! Restaurant & Cafe',
- address: '5402 Portage Rd, Portage, MI 49002',
- contact: '(269) 344-7700',
- website: 'https://bravokalamazoo.com/',
- icon: 'bravo.png'
- }, {
- position: [42.296176, -85.582958],
- brewery: 'Final Gravity Brewing Co',
- address: '246 N Burdick St, Kalamazoo, MI 49007',
- contact: '(269) 350-5136',
- website: 'https://www.finalgravitybrew.com/',
- icon: 'final.png'
- },{
- position: [42.314597, -85.538995],
- brewery: 'Wax Wings Brewing Co',
- address: '3480 Gull Rd, Kalamazoo, MI 49048',
- contact: '(269) 459-9494',
- website: 'https://waxwingsbrewing.com/',
- icon: 'waxwings.png'
- },
- ];
- var previous, distance, path, compare = [];
- brewers.forEach(function(brewer){
- let info = `<div class="marker-title">${brewer.brewery}</div><div>${brewer.address}</div><div>${brewer.contact}</div><div><a href="${brewer.website}">${brewer.website}</a></div>`;
+ distancePath.setMap(null);
- var breweryIcon = L.icon({
- iconUrl: url+brewer.icon,
- iconSize: [65, 95],
- iconAnchor: [22, 94],
- popupAnchor: [-3, -76],
- shadowSize: [68, 95],
- shadowAnchor: [22, 94]
+ distancePath = new google.maps.Polyline({
+ path: coordinates,
+ geodesic: true,
+ strokeColor: '#91311D',
+ strokeOpacity: 1.0,
+ strokeWeight: 2
});
- var leafletMarker = L.marker(
- [brewer.position[0], brewer.position[1]],
- {
- title: brewer.brewery,
- icon: breweryIcon
- }
- )
- .addTo(leafletMap)
- .bindPopup(info)
- .on('click', function(e){
- let lat = e.latlng.lat;
- let lng = e.latlng.lng;
- compare.push(L.latLng(e.latlng.lat, e.latlng.lng) );
- if(compare.length >= 2){
- // console.log(L.GeometryUtil. distance(leafletMap,last(compare), compare[compare.length - 2] ))
- distance = `<div class="distance-marker"><span class="marker-label">Distance:</span> ${convertMetersToFeet(L.GeometryUtil.length([last(compare), compare[compare.length - 2]] ) ).toFixed(2)} Miles</div>`;
- this._popup.setContent(info + distance)
-
- drawLine(last(compare),compare[compare.length - 2]);
-
- } else {
- distance = '';
- }
- })
- });
+
+ distancePath.setMap(map);
+ }
function getMiles(i) {
- return i * 0.00018939;
- };
+ return i*0.000621371192;
+ }
function convertMetersToFeet(meters) {
if (meters < (0)) {
return 'input cannot be less than zero';
} else {
- if(getMiles((meters / 0.3048)) <= 0){
- return `< 1 mile`;
- }else{
- return getMiles((meters / 0.3048));
- }
-
+ return getMiles((meters/0.3048));
}
- };
+ }
last = function(array, n) {
if (array == null)
return void 0;
return array[array.length - 1];
return array.slice(Math.max(array.length - n, 0));
};
- let prev;
- function drawLine(point1, point2) {
- let distancePath;
- let p1 = [point1.lat, point1.lng];
- let p2 = [point2.lat, point2.lng];
- let coordinates = [p1,p2];
- if(prev){
- leafletMap.removeLayer(prev);
- }
+ // Get the path form polyLine
+
+
+ var brewers = [
+ {
+ position: new google.maps.LatLng(42.295573, -85.571195),
+ brewery: 'Arcadia Brewing Co',
+ address: '701 E Michigan Ave, Kalamazoo, MI 49007',
+ contact: '(269) 276-0458',
+ website: "http://arcadiaales.com/",
+ icon: 'arcadia.png',
+
+ }, {
+ position: new google.maps.LatLng(42.2947, -85.5789),
+ brewery: "Bell’s Eccentric Cafe",
+ address: '355 E Kalamazoo Ave, Kalamazoo, MI 49007',
+ contact: '(269) 382-2332',
+ website: 'https://www.bellsbeer.com/',
+ icon: 'bells.png',
+ }, {
+ position: new google.maps.LatLng(42.291180, -85.589856),
+ brewery: 'Gonzo’s BiggDog Brewing',
+ address: '140 S Westnedge Ave, Kalamazoo, MI 49007',
+ contact: '(269) 382-2739',
+ website: 'http://gonzosbiggdoggbrewing.com/',
+ icon: 'gonzo.png'
+ }, {
+ position: new google.maps.LatLng(42.291812, -85.581529),
+ brewery: 'Olde Peninsula Brewpub',
+ address: '200 E Michigan Ave, Kalamazoo, MI 49007',
+ contact: '(269) 343-2739',
+ website: 'http://oldepenkazoo.com/',
+ icon: 'olde.png'
+ }, {
+ position: new google.maps.LatLng(42.290428, -85.594139),
+ brewery: 'Rupert’s Brew House',
+ address: '773 W Michigan Ave, Kalamazoo, MI 49007',
+ contact: '(269) 337-9911',
+ website: 'http://www.rupertsbrewhouse.com/',
+ icon: 'rupert.png'
+ }, {
+ position: new google.maps.LatLng(42.288456, -85.583898),
+ brewery: 'Tibbs Brewing Co.',
+ address: '402 S Burdick St, Kalamazoo, MI 49007',
+ contact: '(877) 762-7397',
+ website: 'http://tibbsbrewing.com/',
+ icon: 'tibbs.png'
+ }, {
+ position: new google.maps.LatLng(42.302854, -85.577619),
+ brewery: 'Boatyard Brewing Co',
+ address: '432 E Paterson St, Kalamazoo, MI 49009',
+ contact: '(269) 226-0300',
+ website: 'https://boatyardbrewing.com/',
+ icon: 'boatyard.png'
+ }, {
+ position: new google.maps.LatLng(42.281642, -85.582770),
+ brewery: 'Brite Eyes Brewing',
+ address: '1156 S Burdick St A, Kalamazoo, MI 49001',
+ contact: '(269) 220-5001',
+ website: 'http://briteeyesbrewingco.com/',
+ icon: 'brite.png'
+ }, {
+ position: new google.maps.LatLng(42.205118, -85.560470),
+ brewery: 'Latitude 42 Brewing Co.',
+ address: '7842 Portage Rd, Portage, MI 49002',
+ contact: '(269) 459-4242',
+ website: 'https://latitude42brewingco.com/',
+ icon: 'latitude.png'
+ }, {
+ position: new google.maps.LatLng(42.248718, -85.559042),
+ brewery: 'One Well Brewing',
+ address: '4213 Portage Street, Kalamazoo, MI 49001',
+ contact: '(269) 459-9240',
+ website: 'http://onewellbrewing.com/',
+ icon: 'one.png'
+ }, {
+ position: new google.maps.LatLng(42.204832, -85.686902),
+ brewery: 'Texas Corners Brewery',
+ address: '6970 Texas Dr, Kalamazoo, MI 49009',
+ contact: '(269) 870-7724',
+ website: 'http://texascornersbrewing.com/',
+ icon: 'texas.png'
+ }, {
+ position: new google.maps.LatLng(42.121430, -85.533167),
+ brewery: 'Distant Whistle Brewhouse',
+ address: '118 S Main St, Vicksburg, MI 49097',
+ contact: '(269) 475-5447',
+ website: 'http://www.distantwhistle.com/',
+ icon: 'distant.png'
+ }, {
+ position: new google.maps.LatLng(42.2716, -85.6307),
+ brewery: 'Bilbo’s Pizza in a Pan',
+ address: '3307 Stadium Dr, Kalamazoo, MI 49008',
+ contact: '(269) 382-5544',
+ website: 'http://www.bilbospizza.com/',
+ icon: 'bilbos.png'
+ }, {
+ position: new google.maps.LatLng(42.239304, -85.560769),
+ brewery: 'Bravo! Restaurant & Cafe',
+ address: '5402 Portage Rd, Portage, MI 49002',
+ contact: '(269) 344-7700',
+ website: 'https://bravokalamazoo.com/',
+ icon: 'bravo.png'
+ }, {
+ position: new google.maps.LatLng(42.296176, -85.582958),
+ brewery: 'Final Gravity Brewing Co',
+ address: '246 N Burdick St, Kalamazoo, MI 49007',
+ contact: '(269) 350-5136',
+ website: 'https://www.finalgravitybrew.com/',
+ icon: 'final.png'
+ },
+ ];
+
+ // Create markers.
+ var infowindow = new google.maps.InfoWindow();
+ var previous, distance, path, compare = [];
+
+ brewers.forEach(function(feature) {
- distancePath = L.polyline(coordinates, {
- color: '#91311D',
+ // console.log(path)
+ let info = `<div class="marker-title">${feature.brewery}</div><div>${feature.address}</div><div>${feature.contact}</div><div><a href="${feature.website}">${feature.website}</a></div>`;
+ var marker = new google.maps.Marker({
+ position: feature.position,
+ icon: url+feature.icon,
+ map: map,
+ html: `<img src="${url}${feature.icon}"/>`
});
- distancePath.addTo(leafletMap);
- prev = distancePath;
- }
- }
- initMap();
-</script>
+ // Add a click listener for this marker
+ marker.addListener('click', function(event) {
+ compare.push(new google.maps.LatLng(event.latLng.lat(), event.latLng.lng()));
+ if(compare.length >= 2){
+ // console.log(`${previous}, ${current}`)
+ distance = `<div class="distance-marker"><span class="marker-label">Distance:</span> ${Math.round(convertMetersToFeet(google.maps.geometry.spherical.computeDistanceBetween(last(compare), compare[compare.length - 2] ) ) * 10) / 10} Miles</div>`;
+
+ drawLine(last(compare),compare[compare.length - 2])
+ } else {
+ distance = '';
+ }
+ infowindow.setOptions({
+ content: info + `${distance}`
+ });
+ infowindow.open(map,this);
+ });
+ });
+ }
+// </script>
+<script src="https://maps.googleapis.com/maps/api/js?place=Kalamazoo,+MI&key=AIzaSyBI5cGUyyZdQOUPCa2I5mvjyOZKSDoijro&callback=initMap&libraries=geometry" async="" defer=""></script>
\ No newline at end of file
projects / WP-Themes / discoverkalamazoo2018.git / commitdiff