जस्ट एचटीएमएल/जेएस और Google मानचित्र पर रीयल टाइम जीपीएस ट्रैकर एक हैंडफोन पर चलाने के लिए? क्या यह संभव है?

Question

मैंने जीपीएस रीयल टाइम ट्रैकिंग पर पढ़ा है और इसके बारे में कई चीजें पाई हैं, ज्यादातर आने वाले डेटा को स्टोर करने के लिए PHP, ज़ोप और डेटाबेस की आवश्यकता है। कुछ अन्य विधियां PHP के संबंधों के साथ AJAX का उपयोग करती हैं।

मेरे प्रश्न के संबंध में, क्या आप एचटीएमएल और जेएस के साथ ऐसा करना संभव है, जब आप शहर में कहीं भी जाते हैं तो Google मानचित्र को पॉप्युलेट करने के लिए मार्कर या किसी और चीज का उपयोग करना संभव है? इस पर कुछ मदद की ज़रूरत है, धन्यवाद!

Answer 1

हां, यह संभव है। नवीनतम स्मार्टफोन में अधिकतर ब्राउज़र W3C Geolocation API को लागू किया है:

भौगोलिक-स्थान API डिवाइस इस तरह के अक्षांश और देशांतर के रूप में कार्यान्वयन, होस्टिंग के साथ ही संबद्ध स्थान जानकारी के लिए एक उच्च स्तरीय इंटरफेस को परिभाषित करता। एपीआई स्वयं अंतर्निहित स्थान जानकारी स्रोतों का अज्ञेयवादी है। स्थान जानकारी के सामान्य स्रोतों में ग्लोबल पोजिशनिंग सिस्टम (जीपीएस) और नेटवर्क सिग्नल जैसे आईपी एड्रेस, आरएफआईडी, वाईफाई और ब्लूटूथ मैक पते, और जीएसएम/सीडीएमए सेल आईडी, साथ ही साथ उपयोगकर्ता इनपुट से अनुमानित स्थान शामिल हैं। कोई गारंटी नहीं दी जाती है कि एपीआई डिवाइस के वास्तविक स्थान को वापस कर देता है।

एपीआई को "एक-शॉट" स्थिति अनुरोध और बार-बार स्थिति अपडेट, साथ ही कैश किए गए पदों को स्पष्ट रूप से क्वेरी करने की क्षमता दोनों को सक्षम करने के लिए डिज़ाइन किया गया है।

गूगल मैप्स पर एक बिंदु साजिश भौगोलिक-स्थान API का उपयोग करना, कुछ इस तरह दिखेगा:

if (navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(function(position) { 

    var point = new google.maps.LatLng(position.coords.latitude, 
             position.coords.longitude); 

    // Initialize the Google Maps API v3 
    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 15, 
     center: point, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 

    // Place a marker 
    new google.maps.Marker({ 
     position: point, 
     map: map 
    }); 
    }); 
} 
else { 
    alert('W3C Geolocation API is not available'); 
} 

ऊपर केवल एक बार स्थिति इकट्ठा करेंगे, और आप चलना शुरू ऑटो अपडेट नहीं होगा जब। इसे संभालने के लिए, आपको अपने मार्कर का संदर्भ रखना होगा, समय-समय पर getCurrentPosition() विधि को कॉल करें, और मार्कर को नए निर्देशांक में ले जाएं। कोड कुछ इस तरह दिख सकता है:

// Initialize the Google Maps API v3 
var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 15, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}); 

var marker = null; 

function autoUpdate() { 
    navigator.geolocation.getCurrentPosition(function(position) { 
    var newPoint = new google.maps.LatLng(position.coords.latitude, 
              position.coords.longitude); 

    if (marker) { 
     // Marker already created - Move it 
     marker.setPosition(newPoint); 
    } 
    else { 
     // Marker does not exist - Create it 
     marker = new google.maps.Marker({ 
     position: newPoint, 
     map: map 
     }); 
    } 

    // Center the map on the new position 
    map.setCenter(newPoint); 
    }); 

    // Call the autoUpdate() function every 5 seconds 
    setTimeout(autoUpdate, 5000); 
} 

autoUpdate(); 

अब अगर ट्रैकिंग क्या आपका मतलब है कि आप भी एक सर्वर पर इस जानकारी को संग्रहीत करना चाहिए (ताकि किसी और आप एक दूरस्थ स्थान से चलती देख सकते हैं) से है, तो आप चाहते AJAX का उपयोग कर सर्वर-साइड स्क्रिप्ट को अंक भेजना होगा।

इसके अतिरिक्त, सुनिश्चित करें कि Google Maps API Terms of Use इस तरह की एक परियोजना में शामिल होने से पहले, इस उपयोग की अनुमति दें।

---

अद्यतन: W3C Geolocation API एक watchPosition() विधि है कि setTimeout() तंत्र हम ऊपर के उदाहरण में इस्तेमाल के बजाय इस्तेमाल किया जा सकता उजागर करता है।