My custom Google Map overlayview gets drawn several times.
I searched the similar question and found them in Java not in Javascript.
Here is my code :
DraggableOverlay.prototype.onAdd = function () {
var container = document.createElement('div'),
that = this;
if (typeof this.get('content').nodeName !== 'undefined') {
container.appendChild(this.get('content'));
} else {
if (typeof this.get('content') === 'string') {
container.innerHTML = this.get('content');
} else {
return;
}
}
container.style.position = 'absolute';
container.draggable = true;
google.maps.event.addDomListener(this.get('map').getDiv(),
'mouseleave',
function () {
google.maps.event.trigger(container, 'mouseup');
});
this.set('container', container)
if (!this.getPanes()) {
return;
}
this.getPanes().floatPane.appendChild(container);
}
DraggableOverlay.prototype.draw = function () {
if (!this.getProjection()) {
return;
}
var pos = this.getProjection().fromLatLngToDivPixel(this.get('position'));
if (!this.get('container')) {
return;
}
this.get('container').style.left = pos.x + 'px';
this.get('container').style.top = pos.y + 'px';
};
But I only draw it once. How does it get drawn several times?
Does anyone meet this issue before?
Thank you.