Subversion Repositories SmartDukaan

Rev

Rev 27372 | Rev 27402 | Go to most recent revision | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
27366 amit.gupta 1 
<!DOCTYPE html>
2 
<html>
3 
  <head>
4 
    <title>Simple Map</title>
5 
    <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
6 
    <script
7 
      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAfPuYFmniE30x275HAAtqz21WkaaGa2bc&callback=initMap&libraries=&v=weekly"
8 
      defer
9 
    ></script>
10 
<style>
11 
#map {
12 
  height: 100%;
13 
}
14 
 
15 
/* Optional: Makes the sample page fill the window. */
16 
html,
17 
body {
18 
  height: 100%;
19 
  margin: 0;
20 
  padding: 0;
21 
}
22 
</style>
23 
    <!-- jsFiddle will insert css and js -->
24 
  </head>
25 
  <body>
26 
    <div id="map"></div>
27 
  </body>
28 
<script type="text/javascript">
29 
	let map;
30 
 
31 
	function initMap() {
32 
	  map = new google.maps.Map(document.getElementById("map"), {
33 
	    center: { lat: 28.644800
34 
, lng: 78.9629 },
35 
	    zoom: 8,
36 
	  });
27369 amit.gupta 37 
	  const coordinates = [];
27372 amit.gupta 38 
	  const icons = [];
27371 amit.gupta 39 
	  const lineSymbol = {
40 
	    path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
41 
	  };
27366 amit.gupta 42 
	#foreach($location in $locations)
27369 amit.gupta 43 
	coordinates.push({lat: $location.getLat(), lng: $location.getLng()});
27373 amit.gupta 44 
	icons.push({icon: lineSymbol, offset: "50%"});
27366 amit.gupta 45 
	#end
46 
	  const flightPath = new google.maps.Polyline({
47 
	    path: coordinates,
27372 amit.gupta 48 
	    icons: icons,
27366 amit.gupta 49 
	    geodesic: true,
50 
	    strokeColor: "#FF0000",
51 
	    strokeOpacity: 1.0,
27370 amit.gupta 52 
	    strokeWeight: 2
27366 amit.gupta 53 
	  });
54 
	  flightPath.setMap(map);
55 
 
56 
	}
57 
</script>
58 
</html>