templates/home/_map.html.twig line 1

Open in your IDE?
  1. <div style="text-align:center;">
  2. <div id="map" style="width:750px;height:500px;display:inline-block;"></div>    
  3. </div>    
  5. <script type="text/javascript">
  6. var amaps = {{ amaps|json_encode()|raw }};
  7.     
  8.     
  9. var icone = new L.icon({
  10.     iconUrl: 'https://cdn1.easyamap.fr/images/logo-easy-amap-icon.png',
  11.     iconSize: [50,60],
  12.     iconAnchor: [25,30]
  13. });        
  15. var latmin = Number.POSITIVE_INFINITY;
  16. var longmin = Number.POSITIVE_INFINITY;
  17. var latmax = Number.NEGATIVE_INFINITY;
  18. var longmax = Number.NEGATIVE_INFINITY;    
  20. var map = L.map('map');
  22. var Stamen_Terrain = L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/terrain/{z}/{x}/{y}.{ext}', {
  23.     attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> &mdash; Map data &copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
  24.     subdomains: 'abcd',
  25.     minZoom: 0,
  26.     maxZoom: 18,
  27.     ext: 'png'
  28. });
  31. Stamen_Terrain.addTo(map);
  33. for (var i in amaps)
  34. {
  35.     if (amaps[i].length == 4)
  36.     {
  37.         var lat = amaps[i][1];
  38.         var lng = amaps[i][2];
  39.         var amap = amaps[i][0];
  40.         var town = amaps[i][3];
  42.         latmin = Math.min(latmin, lat);
  43.         latmax = Math.max(latmax, lat);
  44.         longmin = Math.min(longmin, lng);
  45.         longmax = Math.max(longmax, lng);
  47.         var latlng = new L.LatLng(lat, lng);        
  48.         var marker = new L.marker(latlng, {
  49.                 icon: icone
  50.         });
  52.         var popup = new L.Popup({closeButton: false});
  53.         popup.setContent(amap+"<br /><b>"+town+"</b>");
  54.         marker.bindPopup(popup);
  55.         /*marker.on('mouseover', marker.openPopup.bind(marker));*/
  56.         marker.addTo(map);    
  57.     }
  58. }
  61. var bounds = new L.LatLngBounds([latmin, longmin],[latmax, longmax]);
  62. map.fitBounds(bounds, {padding: [40,40]});
  65. </script>