{{!-- This is my live_traffic.hbs file --}} <link rel="stylesheet" href="/stylesheets/live_traffic_background.css"> <section> <div style="margin-top:50px; margin-right:10px; margin-left:10px"> <head> <script src="jquery-2.1.4.js"></script> <style> #map { height: 500px; } </style> </head> <body> <div id="navbar"><span>Google Maps - Javascript API</span></div> <div id="wrapper"> <div id="map"></div> <script> var map; function initMap() { map = new google.maps.Map(document.getElementById('map'), { center: {lat: 9.385751738316223, lng: 76.57526832439837}, zoom: 13 }); var trafficLayer = new google.maps.TrafficLayer(); var transitLayer = new google.maps.TransitLayer(); var bikeLayer = new google.maps.BicyclingLayer(); $('#traffic-b').click(function(){ trafficLayer.setMap(map); transitLayer.setMap(null); bikeLayer.setMap(null); }); $('#transit-b').click(function(){ trafficLayer.setMap(null); transitLayer.setMap(map); bikeLayer.setMap(null); }); $('#bike-b').click(function(){ trafficLayer.setMap(null); transitLayer.setMap(null); bikeLayer.setMap(map); }); function addMarker(property){ var marker = new google.maps.Marker({ position:property.location, map:map, icon: property.imageIcon }); {{#each data}} // I get this data from index.js contentString = {{this.Count}} {{/each}} var detailWindow = new google.maps.InfoWindow({ content:contentString}); marker.addListener("click", ()=>{ detailWindow.open(map, marker); }) } addMarker({location:{lat: 9.379354015965525, lng: 76.57047517043526}}) addMarker({location:{lat:9.38078985658993, lng: 76.57478706858036}}) addMarker({location:{lat:9.38681169681476, lng: 76.5746661252479}}) addMarker({location:{lat:9.384772998061294, lng: 76.57712632895766}}) } </script> <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCYZ1LKQ6k5jmqEERWADCKR31Tot3fu4Ns&callback=initMap" async defer></script> <button id="traffic-b">Traffic</button> <button id="transit-b">Transit</button> <button id="bike-b">Bike</button> </div> </body> </div> </section>
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)