아래 질문에 대한 보충입니다.
현재 여러개의 마커를 생성하여 마커를 클릭하면 해당하는 인포윈도우가 뜨게 되어있습니다.
다른 마커를 클릭하면 기존 인포윈도우는 닫히고 클릭한 마커의 인포윈도우만 열립니다.
현재 진행 중인 내용이 그림과 같습니다.
-
인포윈도우의 제목을 클릭하면
모니터의 우측에 오버레이가 생성되어 상세정보가 출력되고
-
인포윈도우를 닫으면 오버레이 또한 같이 닫히는 것을 만들고자 합니다.
코드의 방향이나 예제를 알려주시면 힘껏 공부하겠습니다.
고맙습니다.
딱히 지도 객체의 기능을 쓸 필요는 없어 보입니다.
해당 위치에 고정된 인포 패널이 필요한 상황이므로
그냥 div 엘리먼트 하나를 position 및 size 적당히 지정하고
내부 컨텐츠를 구성하신 뒤에
지도 엘리먼트보다 위쪽에 위치하도록 (필요하면 z-index 조정) 하여 띄워주시면 됩니다.
일반적인 마크업 작업이라 생각하시면 되요
답변 감사합니다.
모니터 우측에 인포채널이 항상 떠있지는 않고
인포창을 클릭했을 때 인포채널이 뜨는 예제를 찾고 있습니다.
- 인포창을 클릭했을 때 div 가 뜨고
- div 를 닫으면 div가 닫히고
- 인포창을 닫으면 div 도 닫히는 (인포창에 종속된 인포채널)
예제가 있는지 궁금합니다…
항상 감사합니다.
항상 떠 있는지 아닌지는 중요하지 않습니다.
그건 이벤트로 조절할 수 있으니까요.
[마커] - [커스텀 오버레이] - [인포 패널]
을 한 세트로 생각하시고
- 커스텀 오버레이의 x 버튼 클릭 이벤트: 커스텀 오버레이 닫기, 인포 패널 hide
- 인포 패널의 x 버튼 클릭 이벤트: 위와 똑같은 핸들러 등록 (커스텀 오버레이 닫기, 인포 패널 hide)
DOM Event를 다루는 것과 다른게 없습니다.
View(인포 패널)만 만들어 두고 단순 이벤트 연결해서 show/hide 하는 작업이라
이벤트 관련한 샘플 참고하시고 응용하시면 충분히 구현하실 수 있습니다.