커스텀 오버레이를 고정시킬수 있는 방법이 있나요?

AbstractOverlay를 활용하여 고정을 시킬 수 있습니다.

아래 코드는 커스텀 타일셋1 예제와 AbstractOverlay를 사용하여 고정시킨 코드로 참고만 해주세요.

// 오버레이로 올릴 이미지의 bounds를 받아 AbstractOverlay를 생성합니다.
function GroundOverlay(bounds, imgSrc) {
    this.bounds = bounds;
	var node = this.node = document.createElement('div');
    node.className = 'node';
   
    var img = this.img = document.createElement('img');
    img.style.position = 'absolute';
    img.src = imgSrc;
    
    node.appendChild(img);
}

GroundOverlay.prototype = new kakao.maps.AbstractOverlay;
    
GroundOverlay.prototype.onAdd = function() {
     var panel = this.getPanels().overlayLayer;
	 panel.appendChild(this.node);
};

// 줌인 아웃 시 이미지를 원하는 bounds값에 맞게 표출하기 위해 img style을 정의 및 선언합니다.
GroundOverlay.prototype.draw = function() {
    var projection = this.getProjection();
    var ne = projection.pointFromCoords(this.bounds.getNorthEast());
    var sw = projection.pointFromCoords(this.bounds.getSouthWest());
    
    var width = ne.x - sw.x;
	var height = sw.y - ne.y;  
    
    this.img.style.top = ne.y+'px';
    this.img.style.left = sw.x+'px';
    this.img.style.width = width+'px';
    this.img.style.height = height+'px';
}
    
GroundOverlay.prototype.onRemove = function() {
   this.node.parentNode.removeChild(this.node);
};

// 해당 좌표는 예제 타일셋에서 projectionId: null로 선언이 되어 있기 때문에 pixel 좌표를 사용하였습니다.
var sw = new kakao.maps.Coords(500,0)
    ne = new kakao.maps.Coords(1000, -500);

var bounds = new kakao.maps.CoordsBounds(sw, ne);
    
var overlay = new GroundOverlay(bounds, 'http://t1.daumcdn.net/localimg/localimages/07/mapapidoc/roadviewoverlay_img_02.png');
overlay.setMap(map);