javascript - school bus tracking gps web app -
i developing 1 school management application in php.for need develop 1 module school bus tracking.but new topic. have gone through many searches.but no luck.
<script> var watchid = null; $(document).ready(function() { var optn = { enablehighaccuracy: true, timeout: infinity, maximumage: 0 }; if (navigator.geolocation) navigator.geolocation.watchposition(success, fail, optn); else $("p").html("html5 not supported"); $("button").click(function() { if (watchid) navigator.geolocation.clearwatch(watchid); watchid = null; return false; }); }); function success(position) { var googlelatlng = new google.maps.latlng(position.coords.latitude, position.coords.longitude); var mapotn = { zoom: 10, center: googlelatlng, maptypeid: google.maps.maptypeid.road }; var pmap = document.getelementbyid("map"); var map = new google.maps.map(pmap, mapotn); addmarker(map, googlelatlng); } function addmarker(map, googlelatlng, title, content) { var markeroptn = { position: googlelatlng, map: map, title: title, animation: google.maps.animation.drop }; var marker = new google.maps.marker(markeroptn); var infowindow = new google.maps.infowindow({ content: content, position: googlelatlng }); google.maps.event.addlistener(marker, "click", function() { infowindow.open(map); }); } </script>
i found code.but code shows map of location.but want track bus location.how can location of bus.and tracker device preferable use?
thanks in advance
luckily, have managed implement similar app. check here: tracking app
.(use 32003693 credential , 6 freight id) . used script location: //i have omitted parts of code
< script type = "text/javascript" > $(document).ready(function() { if (navigator.geolocation) { navigator.geolocation.getcurrentposition(showlocation); //alert("geotrack working..."); } else { $('#removemessages').html('this app not supported browser or os.'); } }); //setinterval(showlocation(position),10000); function showlocation(position) { var latitude = position.coords.latitude; var longitude = position.coords.longitude; var freightid = <?php echo $freightid?>; //this used identify freight $.ajax({ type: 'post', url: 'controllers/getlocation.php', //php save tracked locations data: 'latitude=' + latitude + '&freightid=' + freightid + '&longitude=' + longitude, //data coordinates datatype: 'json', success: function(msg) { if (msg) { $("#location").html(msg.locationname); $("#lat").html(msg.lat); $("#lgt").html(msg.lgt); initializemap(msg.lat, msg.lgt, msg.locationname, msg.locationname); } else { $("#location").html('not available'); initializemap(0, 0, "undefined location", "undefined country"); //where initialize map } settimeout(function() { showlocation(position); //this send request again , again after 3 seconds or time want. case set seconds patients sake }, 1800); } }); } < /script> <!-- script initialize map , place maker on location obtained--> < script src = "https://maps.google.com/maps/api/js?key=youur api key" type = "text/javascript" > < /script> < script type = "text/javascript" > //initializemap(); function initializemap(custom_lat, custom_lng, title, address) { var locations = [ [address, custom_lat, custom_lng, 2] ]; var map = new google.maps.map(document.getelementbyid('map_canvas'), { zoom: 8, center: new google.maps.latlng(-0.2842285, 36.0729164), maptypeid: google.maps.maptypeid.roadmap }); var infowindow = new google.maps.infowindow(); var marker, i; (i = 0; < locations.length; i++) { var indetify = locations[i][3]; var iconset = "http://ruralshores.com/assets/library_maps.png" // alert("identify:"+indetify); if (indetify == 1) { iconset = "../dist/images/map/1.png"; } else { iconset = "../dist/images/map/2.png"; } marker = new google.maps.marker({ position: new google.maps.latlng(locations[i][1], locations[i][2]), map: map, animation: google.maps.animation.drop, icon: iconset, optimized: false }); google.maps.event.addlistener(marker, 'click', (function(marker, i) { return function() { infowindow.setcontent(locations[i][0]); infowindow.open(map, marker); marker.setanimation(google.maps.animation.bounce); } })(marker, i)); } } < /script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Comments
Post a Comment