커스텀오버레이 사용 시 인포윈도우 없애는 방법

안녕하세요! 개발 공부를 하고 있는 학생입니다!!

이번에 프로젝트를 진행하게 되면서 지도 api 기능을 맡게되었습니다.

카카오 map api 문서와 구글링을 통해 한 단계씩 도장깨는 마음으로 지도 기능을 구현중인데요.

마지막으로 남은 구현이 커스텀 오버레이 활용하는 부분입니다.

구현 과정에서 구글링과 문서, Dev Talk 게시글들을 보아도 잘 모르겠어서 이렇게 질문합니다.

image
제가 완성해야하는 기능의 최종 모습은 위 사진과 같습니다!!

image
현재 제가 구현한 상태입니다.

마커에 마우스 오버 시 장소 이름이 나타나야하는데,
혹시 몰라 전체 코드 첨부합니다!!

    // 장소 검색 객체를 생성합니다
    const ps = new kakao.maps.services.Places();

    // 키워드로 장소를 검색합니다
    searchPlaces();

    // 키워드 검색을 요청하는 함수
    function searchPlaces() {
      const keyword = searchPlace;
      if (!keyword.replace(/^\s+|\s+$/g, "")) {
        return false;
      }
      // 장소검색 객체를 통해 키워드로 장소검색을 요청
      ps.keywordSearch(searchPlace, placesSearchCB);
    }

    //키워드 확인을 위한 콘솔
    // console.log(searchPlace);

    // 장소검색이 완료됐을 때 호출되는 콜백함수 입니다
    function placesSearchCB(data, status, _pagination) {
      if (status === kakao.maps.services.Status.OK) {
        const bounds = new kakao.maps.LatLngBounds();

        for (let i = 0; i < data.length; i++) {
          displayMarker(data[i]);
          bounds.extend(new kakao.maps.LatLng(data[i].y, data[i].x));
          //경도, 위도
          // console.log(data[i].y, data[i].x);
        }
        // 검색된 장소 위치를 기준으로 지도 범위를 재설정
        map.setBounds(bounds);
      }
    }

    // 검색 결과 목록과 마커를 표출하는 함수입니다
    function displayMarker(place) {
      const imageSrc = small;
      const imageSize = new kakao.maps.Size(32, 40);
      const imageOption = { offset: new kakao.maps.Point(17, 36) };

      const markerImage = new kakao.maps.MarkerImage(
        imageSrc,
        imageSize,
        imageOption
      );
      // console.log(place);
      // console.log(typeof place.x);
      let marker = new kakao.maps.Marker({
        map: map,
        position: new kakao.maps.LatLng(place.y, place.x),
        image: markerImage,
      });

      const iwContent = `<div class="info-title_div"><span class="info-title_span">${place.place_name}</span></div>`;

      // 마커에 표시할 인포윈도우를 생성합니다
      const infowindow = new kakao.maps.InfoWindow({
        content: iwContent,
      });

      (function (marker, infowindow) {
        // 마커에 mouseover 이벤트를 등록하고 마우스 오버 시 인포윈도우를 표시합니다
        kakao.maps.event.addListener(marker, "mouseover", function () {
          infowindow.open(map, marker);
        });

        // 마커에 mouseout 이벤트를 등록하고 마우스 아웃 시 인포윈도우를 닫습니다
        kakao.maps.event.addListener(marker, "mouseout", function () {
          infowindow.close();
        });
      })(marker, infowindow);
    }

인포윈도우 부분만 제거하는 방법이 있을까요?

공식 문서 외 제가 찾아봤던 게시글도 함께 첨부합니다!!

그누보드 - 카카오지도 인포윈도우(infoWindow) 커스텀하기 > 그누보드5 팁자료실 (sir.kr)
React - Kakao Maps API 이용하기(feat. 커스텀 오버레이) (velog.io)

인포윈도우는 내부에 스타일이 고정되어 있기 때문에 변경할 수 없습니다.
아래 문서 참고해서 커스텀 오버레이로 변경해주세요.
https://apis.map.kakao.com/web/documentation/#CustomOverlay