function initMap() { var bounds = new google.maps.LatLngBounds(); var map = new google.maps.Map(document.getElementById('artisans-map'), { styles: styleMap }); var icon = { url: "https://artisans.quelleenergie.fr/assets/icones/geolocalize-02-57f71366ba86f935cf6949b551c67cc17042750d0fc34a5d7af80ac028bfae86.svg", scaledSize: new google.maps.Size(40, 40) } var iconSelectionne = { url: "https://artisans.quelleenergie.fr/assets/icones/geolocalize-01-5fe26a2a4ce9fd6566cc27b4fabb592a37fa7722f3e3d73019830ede8c4dbd05.svg", scaledSize: new google.maps.Size(40, 40) } var markers = [[46.1321579, 3.472077, "da-silva-gil-michel-65a4e6cd-5014-47a3-955c-71ab86a610a2"], [49.24108709999999, -0.6016661999999999, "rv-bat-iment-33723"], [48.7815466, 2.211465, "rougnon-be3efbae-b44a-49ef-84cd-f67b1c4b632c"], [45.5836645, 5.3041562, "87761298600019"], [45.8158731, 1.2770439, "quali-renov-37630"], [43.3504532, 1.2342733, "castel-plomberie"], [45.6970399, 5.0168596, "tcm-agencements"], [48.8900077, 2.4132249, "rocher-et-amouroux-c999d2af-1b2b-45b6-9c0c-0c4414acc35c"], [45.901934, 6.128088300000001, "alveare-architecture-b3b4f1cc-4cf9-447d-b786-f84b6545481a"], [49.167629, 5.424434, "ascz-constructions"]]; var dernierMarkerSelectionne; var listeObjetMarkers = [] for( i = 0; i < markers.length; i++ ) { var position = new google.maps.LatLng(markers[i][0], markers[i][1]); bounds.extend(position); marker = new google.maps.Marker({ position: position, map: map, url: markers[i][2], icon: icon }); listeObjetMarkers.push(marker) google.maps.event.addListener(marker, 'click', function() { montreCardArtisan(this); }); } map.fitBounds(bounds) map.panToBounds(bounds) $('.artisans-container .artisan-item').hover(function(){ montrePositionArtisan($(this)); }); function deselectionneMarker() { if (dernierMarkerSelectionne != undefined) { dernierMarkerSelectionne.setIcon(icon); } } function selectionneMarker(element) { $('.artisan-item.selectionne').removeClass('selectionne') element.toggleClass('selectionne') } function montreCardArtisan(marker) { deselectionneMarker(); marker.setIcon(iconSelectionne); var element = $('#'+marker.url); $('html, body').animate({ scrollTop: element.offset().top }, 600 ); selectionneMarker(element); dernierMarkerSelectionne = marker } function montrePositionArtisan(element) { selectionneMarker(element) var index = element.attr('id') for( i = 0; i < markers.length; i++ ) { if (listeObjetMarkers[i].url == index) { deselectionneMarker(); listeObjetMarkers[i].setIcon(iconSelectionne); dernierMarkerSelectionne = listeObjetMarkers[i] } }; } } $(document).on('turbolinks:load', function () { initMap(); });