github.com/insionng/yougam@v0.0.0-20170714101924-2bc18d833463/themes/wind/static/js/maps/demo.js (about) 1 !function ($) { 2 3 $(function(){ 4 map = new GMaps({ 5 div: '#gmap_geocoding', 6 lat: 37.77493, 7 lng: -122.419416, 8 zoom: 4 9 }); 10 11 map.addMarker({ 12 lat: 37.77493, 13 lng: -122.419416, 14 title: 'Marker', 15 infoWindow: { 16 content: 'Info content here...' 17 } 18 }); 19 20 $('#geocoding_form').submit(function(e){ 21 e.preventDefault(); 22 GMaps.geocode({ 23 address: $('#address').val().trim(), 24 callback: function(results, status){ 25 if(status=='OK'){ 26 var latlng = results[0].geometry.location; 27 map.setCenter(latlng.lat(), latlng.lng()); 28 map.addMarker({ 29 lat: latlng.lat(), 30 lng: latlng.lng() 31 }); 32 } 33 } 34 }); 35 }); 36 37 $('#start_travel').click(function(e){ 38 $('#instructions').html(''); 39 e.preventDefault(); 40 map.setZoom(8); 41 map.travelRoute({ 42 origin: [37.77493,-122.419416], 43 destination: [37.339386,-121.894955], 44 travelMode: 'driving', 45 step: function(e){ 46 $('#instructions').append('<li><i class="fa-li fa fa-map-marker fa-lg icon-muted"></i> '+e.instructions+'</li>'); 47 $('#instructions li:eq('+e.step_number+')').delay(450*e.step_number).fadeIn(200, function(){ 48 map.setCenter(e.end_location.lat(), e.end_location.lng()); 49 map.drawPolyline({ 50 path: e.path, 51 strokeColor: '#131540', 52 strokeOpacity: 0.6, 53 strokeWeight: 4 54 }); 55 }); 56 } 57 }); 58 }); 59 60 }); 61 }(window.jQuery);