2012-10-03 9 views
5

संभव डुप्लिकेट:
How to highlight a user's current location in google maps?वर्तमान स्थान मार्कर (नीले वृत्त)

वहाँ जावास्क्रिप्ट गूगल मैप्स एपीआई का उपयोग कर वर्तमान स्थान में नीले वृत्त मार्कर पाने के लिए कोई भी तरीका है?

उत्तर

6

navigator.geolocation दृष्टिकोण का उपयोग करें, और अपने नीले वृत्त के लिए

https://developer.mozilla.org/en-US/docs/Using_geolocation

https://developers.google.com/maps/documentation/javascript/overlays#Icons

संपादित कस्टम आइकन का उपयोग:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <title>Google Maps User Location</title> 
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 
    <style> 
    html, body, #map_canvas{width:100%;height:100%;} 
    </style> 
    </head> 
    <body onload="locate()"> 
    <div id="map_canvas"></div> 
    </body> 
    <script> 
    var im = 'http://www.robotwoods.com/dev/misc/bluecircle.png'; 
    function locate(){ 
     navigator.geolocation.getCurrentPosition(initialize,fail); 
    } 

    function initialize(position) { 
     var myLatLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 
     var mapOptions = { 
      zoom: 4, 
      center: myLatLng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     } 
     var map = new google.maps.Map(document.getElementById('map_canvas'), 
             mapOptions); 
     var userMarker = new google.maps.Marker({ 
      position: myLatLng, 
      map: map, 
      icon: im 
     }); 
     } 

    function fail(){ 
     alert('navigator.geolocation failed, may not be supported'); 
    } 
    </script> 
</html> 
+0

जिज्ञासा से नीले सर्कल के लिए आपको यूआरएल कैसे मिला? –

+0

वास्तव में याद नहीं किया जा सकता है, शायद इसे फ़ोटोशॉप में बनाया हो सकता है, इसे उस यूआरएल से बचाने के लिए स्वतंत्र महसूस करें, लेकिन वह प्री-रेटिना डिवाइस था। –

संबंधित मुद्दे