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 = [[50.7021411, 2.8871982, "91501672900013"], [48.0776524, 7.3529594, "groupe-ecade-0b5db662-7ed9-453c-a9e7-b70efab04118"], [49.6299591, -1.5961249, "masselin-energie-35869e8f-1bba-4f83-92bb-597a518e9237"], [49.114932, 6.2335938, "groupe-renov-est"], [49.1520807, 0.2558381000000001, "masselin-energie-f6d02de0-e081-49d0-8737-5af51dd467e4"], [48.8258637, 2.5733133, "mailfert-59383"], [49.2505467, 4.0514147, "isol-habitat-63b7f689-6e14-4f5c-8362-38580d6ed34b"], [45.5699397, 5.9475149, "mbpa-renov-sarl"], [43.5985101, 3.1400372, "inesta-sebastien-bfafb9b2-6f2a-42f9-ae40-f876626eb55f"], [48.3853617, 2.7862148, "demanche-alexis-aadf1287-43b1-4d34-956d-f96f788e29c8"]]; 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(); });