Google Maps 마커의 HTML DOM 요소를 얻는 방법은 무엇입니까?

Question

GMarker JS 변수가 있으면이 변수를 나타내는 HTML DOM 요소를 어떻게 얻을 수 있습니까? 내가 올바른을 올바른 Z- 색인으로지도에 삽입 할 수 있도록이 것이 필요합니다.

감사합니다.

Answer 1

Google지도 API가 마커의 DOM 요소를 반환하는 메소드를 제공하지 않는 것 같습니다.

나만의 맞춤 마커를 만들고 싶습니까? 그렇다면 GOverlay를 확장하는 마커 클래스를 만들 수 있습니다. MarkerLight은이를 수행하는 방법에 대한 좋은 예입니다 (여기는 example page입니다).

맞춤 아이콘이 필요한 경우이를 수행하는 방법은 here입니다.

Answer 2

그런 오래된 질문을 게시하는 것에 대해 유감스럽게 생각합니다. 그러나 나는이 문제를 직접 경험했습니다. Google Maps APIv3에서 사용한 솔루션은 "맞춤 마커"를 the Google Maps samples에서 복사하고 간단한 방법 인 getDOMElement을 추가하여 마커 구성에서 div을 생성합니다.

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

그런 다음 사용할 수 있습니다 marker.getDOMElement().style 동적으로 마커의 스타일을 변경하고, marker.getDOMElement()의 img 자식 요소는 사용하는 아이콘이다, 그래서 당신은 동적으로 너무 그것을 변경할 수 있습니다.

Answer 3

더 간단한 CustomMarker를 사용하고 있습니다. DOM 요소를 제공하면 마커로 사용됩니다.

// 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); 
}; 

~