카카오맵 커스텀 오버레이 줌 바꿀 때 위치 바뀌는 현상

커스텀 오버레이의 content는 HTML문자열과 HTMLElement만 설정할 수 있습니다.
이전 방식은 content를 컴포넌트 객체로 설정했기 때문에
API에서 처리할 수 있는 값이 아니므로 부작용이 일어납니다.

아래와 같이 HTMLElement로 content를 구성한 다음
생성한 객체에 직접 이벤트를 등록해주세요.

// content HTMLElement 생성
let content = document.createElement('div');
content.style.paddingTop = '30px';

let title = document.createElement('div');
title.appendChild(document.createTextNode('연산공원'));
title.onclick = () => {
    console.log('im clicked');
}

let distance = document.createElement('div');
distance.appendChild(document.createTextNode('출근가능거리: 100m'));

content.appendChild(title);
content.appendChild(distance);

let customOverlay = new kakao.maps.CustomOverlay({
    map: map,
    position: marker.getPosition(),
    content: content,
    xAnchor: 0.5,
    yAnchor: 0.5
});