카카오 맵 위에 이미지 띄우기 관련 문의드립니다

[FAQ] 지도/로컬 API 문의 전 꼭 읽어 주세요.

현재 사용자가 등록한 이미지와 좌표를 이용해 카카오맵 위에 띄워주는 기능을 만들고 있습니다.

여러 예시와 문의사항을 보면서 사각형으로 사용자가 좌표를 지정하면 그 안에 이미지를 넣어 표시하는 것 까진 진행하였는데

  1. 사용자의 이미지가 사각형이 아닌 다각형인 경우 표시문제
  2. 사각형 영역이 아닌 다각형(폴리곤)과 같은 영역에 이미지가 표시가 가능한지

문의 드립니다.

1번 문의 이미지(표시문제)

1번 문의 이미지 원본

현재 사용중인 코드

               const imgQuery = async (map) => {
                    clearMap()
                    let item = ls.value.sheet.master.item
                    var sw = new kakao.maps.LatLng(item.LATITUDE_1, item.LONGTITUDE_1);
                    var ne = new kakao.maps.LatLng(item.LATITUDE_2, item.LONGTITUDE_2);
                    var bounds = new kakao.maps.LatLngBounds(sw, ne);

                    ls.value.overlay = new GroundOverlay(bounds, ls.value.url)
                    ls.value.overlay.setMap(ls.value.mapWaiting)
                    // if(ls.value.mapType === 'skyview') ls.value.overlay.setMap(ls.value.mapWaiting)
                }

표시 문제는 검정 배경이 깔린 부분 때문에 문제라고 하신 걸까요?
img 태그에 background color 속성이 검정으로 들어가 있어서 표시되고 있는 걸로 보이는데 확인 부탁드립니다.

그리고 GroundOverlay는 사각영역에서 표현되기 때문에 다각형 이미지를 사용할 경우
첨부 이미지처럼 투명 배경위에 다각형을 올려서 사용해주세요.