Google मानचित्र मार्कर का HTML DOM तत्व कैसे प्राप्त करें?

Question

जीएमकर जेएस वैरिएबल को देखते हुए, मैं HTML डीओएम तत्व कैसे प्राप्त करूं जो इसका प्रतिनिधित्व करता है? मुझे इसकी आवश्यकता है ताकि मैं सही z-index के साथ मानचित्र में <div> अपने आप में डाल सकूं।

धन्यवाद।

Answer 1

ऐसा लगता है कि Google मानचित्र API मार्कर के DOM तत्व को वापस करने के लिए कोई तरीका प्रदान नहीं करता है।

क्या आप बस अपना खुद का कस्टम मार्कर बनाना चाहते हैं? यदि ऐसा है, तो आप एक मार्कर क्लास बना सकते हैं जो गोवरले को बढ़ाता है। MarkerLight यह कैसे पूरा करने का एक शानदार उदाहरण है (और यहां example page है)।

यदि आपको केवल एक कस्टम आइकन चाहिए, तो here यह कैसे करना है।

Answer 2

ऐसे पुराने प्रश्न पर पोस्ट करने के लिए खेद है, लेकिन मैं अभी इस पर आ गया हूं। Google मानचित्र APIv3 में उपयोग किया गया समाधान the Google Maps samples से "कस्टम मार्कर" की प्रतिलिपि बनाना था और एक सरल विधि getDOMElement जोड़ें, जो मार्कर के निर्माण में उत्पन्न div देता है।

CustomMarker.prototype.getDOMElement = function() { 
    return this.div_; 
} 

फिर आप उपयोग कर सकते हैं marker.getDOMElement().style गतिशील रूप से आपकी मार्कर के स्टाइल बदलने के लिए, और marker.getDOMElement() की img चाइल्ड तत्व इस्तेमाल किया आइकन है, तो आप गतिशील रूप भी बदल सकते हैं।

Answer 3

यह एक आसान कस्टममार्कर है जिसका मैं उपयोग कर रहा हूं। बस इसे एक डीओएम तत्व प्रदान करें और इसका उपयोग मार्कर के रूप में किया जाएगा!

// based on http://gmaps-samples-v3.googlecode.com/svn/trunk/overlayview/custommarker.html 

function CustomMarker(options) { 
    this.options = options; 
    this.element = options.element; 
    this.map = options.map; 
    this.position = options.position; 
    this.positionFunction = options.positionFunction || function() { 
    var point = this.getProjection().fromLatLngToDivPixel(this.position); 
    if (point) { 
     this.element.style.position = 'absolute'; 
     this.element.style.left = (point.x - jQuery(this.element).width()/2) + 'px'; 
     this.element.style.top = (point.y - jQuery(this.element).height()) + 'px'; 
     this.element.style.cursor = 'pointer'; 
    } 
    }; 

    this.setMap(this.map); 
} 

CustomMarker.prototype = new google.maps.OverlayView(); 
CustomMarker.prototype.draw = function() { 
    if (!this.div_) 
    this.getPanes().overlayImage.appendChild(this.element); 
    this.positionFunction(); 
}; 
CustomMarker.prototype.getPosition = function() { 
    return this.position; 
}; 
CustomMarker.prototype.setVisible = function(bool) { 
    jQuery(this.element).toggle(bool); 
}; 

~