지도 게시 가이드

지도 게시는 편집 가능한 지도를 다른 사람이 열거나 임베드하거나 제품 안에서 사용할 수 있는 안정적인 경험으로 바꾸는 과정입니다. 주요 선택지는 독립 공유 링크, 임베드된 Viewer, 더 깊은 애플리케이션 통합입니다. 운영 지도에는 URL뿐 아니라 접근 규칙, 허용된 임베드 도메인, 라이브 버전, 모바일 레이아웃, 출시 및 게시 취소 절차, 측정도 필요합니다.

아래에서는 게시 모델, 접근 및 도메인 제어, 임베드 레이아웃, 메시징, 버전 관리, 분석, Kaleidr Studio와 Viewer 화면을 다룹니다. 제품 정보는 Kaleidr Studio에서 확인하세요. 임베드 방식은 인터랙티브 지도를 웹사이트에 임베드하는 방법, 빌더와 API의 책임 분담은 노코드 지도 빌더와 지도 API, SDK 마운트는 AI 지도 SDK란?을 참고하세요.

게시 핵심 사항

제작 ≠ 게시: 초안은 바뀔 수 있지만 게시 지도에는 안정적인 사용 화면이 필요합니다.

결합도를 선택하세요: 공유 링크는 가볍고, 임베드는 페이지 안에 있으며, 제품 통합은 애플리케이션 상태를 공유합니다.

호스트를 제한하세요: 허용 도메인과 오리진 검증은 게시 계약에 포함됩니다.

공간을 확보하세요: 접힌 임베드는 레이아웃 문제이지 지도 문제가 아닙니다.

안정적인 ID 뒤에서 버전을 관리하세요: 모든 호스트 페이지를 다시 쓰지 않고 측정, 검토, 출시, 롤백할 수 있습니다.

인터랙티브 지도가 제작과 검토, 게시를 거쳐 독립 공유, 웹사이트 임베드, 제품 통합으로 이어지고 운영 제어를 적용받는 모습.

지도 게시란 무엇인가요?

지도를 만드는 단계와 게시하는 단계는 다릅니다. 제작 중에는 장소, 레이어, 레이블, 색상, 타일, 카메라, 필터, 상호작용, 데이터 원본을 바꿀 수 있습니다. 게시하면 독립 페이지, 웹사이트 임베드, SaaS 위치 찾기, 편집용 지도, 내부 읽기 전용 보기 같은 사용 화면이 생깁니다. 제작 도구는 초안을 허용할 수 있지만 게시 지도에는 예측 가능한 접근, 레이아웃, 성능, 동작, 버전, 출처 표시, 모니터링이 필요합니다. Kaleidr Studio는 현재 제작 과정을 Prompt → Process → Refine → Deploy로 설명하며, 완성된 지도를 독립 페이지로 게시하거나 위젯으로 임베드할 수 있다고 안내합니다(Studio).

게시 지도를 공유, 임베드, 통합 중 어떻게 제공해야 하나요?

세 모델이 대부분의 출시를 포괄합니다. 공유 링크는 호스트 사이트 구현이 거의 필요 없어 검토, 캠페인, 가이드에 가장 빠릅니다. 임베드 Viewer는 지도를 본문 및 CTA와 함께 보여 주는 웹사이트, 랜딩 페이지, CMS, 고객 포털에 적합합니다. 제품 통합은 필터, 선택 레코드, 애플리케이션 상태를 지도와 동기화해야 하는 SaaS, 마켓플레이스, 맞춤 워크플로에 적합합니다. 지도 역할이 주로 콘텐츠인지, 임베드 경험인지, 애플리케이션 상태의 일부인지에 따라 선택하세요. 공유 링크로 시작해 나중에 임베드나 제품 컴포넌트로 전환할 수도 있습니다.

모델	적합한 용도	호스트 개발	제품 결합도
공유 링크	검토, 캠페인, 가이드	최소	낮음
임베드 Viewer	웹사이트, CMS, 포털	낮음	중간
제품 통합	SaaS, 맞춤 워크플로	높음	높음

Kaleidr의 최신 개발자 문서는 게시된 Viewer 지도를 일반 API 키가 아니라 공유 링크로 제한하고 공유 ID로 지정한다고 설명합니다(Viewer Embed). 공유 ID는 게시 경험을 식별하며 서버 비밀이 아니므로 그렇게 취급해서는 안 됩니다. Studio는 게시 후 지도를 위젯으로 임베드할 수 있다고 안내합니다. Chat은 기존 호스트 지도에 연결할 수 있고, Viewer는 게시된 지도 경험을 중심으로 설계되었습니다(kaleidr.js).

독립 공유 링크, 웹사이트 임베드 지도, 애플리케이션 상태와 깊이 통합된 지도라는 세 가지 게시 모델.

운영 임베드는 레이아웃, 접근, 메시징을 어떻게 처리해야 하나요?

출시 전에 게시 계약을 정하세요. 공개 또는 제한 접근, 허용 임베드 도메인, 초안·게시·보관 상태, 라이브 화면에서 검토된 데이터 스냅샷을 보여 줄지 결정합니다. 도메인 제어에는 https://www.example.com, https://app.example.com 같은 순수 오리진을 사용해야 합니다. 최신 Viewer 문서는 게시자가 임베드된 게시 지도의 허용 도메인을 설정한다고 설명합니다. 로그인으로 보호된 호스트 페이지가 독립적으로 접근 가능한 지도 URL까지 자동으로 비공개로 만들지는 않습니다. 비공개 비즈니스 데이터에는 해당 용도로 설계된 권한 부여 구조가 필요합니다.

임베드가 접히지 않도록 높이와 너비를 확보하세요. HTML 명세는 보조 기술이 중첩된 탐색 컨텍스트를 식별할 수 있도록 iframe에 간결한 title을 권장합니다(HTML Standard). 프레임에 프로그래밍으로 확인할 수 있는 이름을 요구하는 하드 요건은 WCAG 4.1.2에 있습니다. 화면 밖 임베드에는 지원되는 loading="lazy"를 사용하세요. HTML 표준은 지연 로딩 속성을 정의하고 web.dev는 네트워크와 시작 작업을 줄이기 위해 화면 밖 iframe을 미루도록 권장합니다. 반면 첫 화면의 주요 지도는 핵심 경험으로 로드해야 합니다. Viewer가 실패해도 페이지가 작동하도록 장소명, 주소, 목록 같은 텍스트 대안을 유지하세요.

교차 오리진 통신은 통제된 채널에서 이뤄져야 합니다. window.postMessage()는 창과 iframe 사이의 표준 메커니즘입니다(HTML Standard). 수신 메시지의 event.origin을 검증하고 발신 메시지에는 특정 대상 오리진을 설정하세요. 기본값으로 "*"를 쓰지 마세요. Viewer 문서는 지원 동작을 위한 kaleidr-embed:* 메시지 경계를 설명합니다. Viewer와 호스트 상태는 분리해야 합니다. 게시 지도는 Viewer 안의 카메라와 선택을 담당하고, 호스트 페이지는 탐색, 양식, 전환을 담당합니다.

// Published Viewer mount: share ID, not a server key
Kaleidr.mount("#published-map", {
  product: "viewer",
  shareId: "YOUR_SHARE_ID"
});

호스트 페이지, 교차 오리진 Viewer, 허용 도메인 게이트, 검증된 메시징, 반응형 크기, 지연 로딩, 텍스트 대안을 포함한 운영 지도 임베드 구조.

게시 지도의 버전을 관리하고 측정하고 롤백하려면 어떻게 해야 하나요?

초안 저장은 라이브 버전 게시와 다릅니다. 콘텐츠 변경 시 호스트 페이지가 깨지지 않도록 장소와 임베드에 안정적인 ID를 유지하세요. 그 ID 뒤에서 새 초안 편집, 데이터 품질과 모바일 레이아웃 검토, 게시, 운영 확인, 실패 시 롤백을 진행합니다. 지도 로드 수 이상을 측정하세요. 지도 준비 완료, 장소 선택, CTA, 오류가 유용한 신호입니다. 제품이 자동 이벤트로 문서화하지 않았다면 이런 이름은 편집상 권장 사항으로 간주하세요. 초안 실험이 운영 퍼널을 오염시키지 않도록 제작 분석과 Viewer 분석을 분리합니다.

차단된 도메인, 게시되지 않은 공유 ID, 느린 네트워크, 누락된 텍스트 대안을 테스트하세요. 운영 도메인, Content Security Policy, 출처 표시, 외부 링크 안전성도 같은 릴리스에 포함됩니다. CMS 페이지에는 공간이 확보된 컨테이너와 검토된 스냅샷이 필요합니다. SaaS 제품은 지도를 애플리케이션 상태와 결합해야 합니다. 마케팅 페이지에는 지도 상호작용에만 의존하지 않는 전환 경로가 필요합니다. 실시간 및 3D 지도는 성능과 대안 요구가 더 크므로 호스트 페이지가 그 비용을 감당할 때만 게시하세요.

Viewer 분석이 새 초안, 검토된 릴리스, 확인, 롤백에 반영되고 임베드 ID는 안정적으로 유지되는 운영 게시 주기.

팀이 피해야 할 지도 게시 실수는 무엇인가요?

실수	위험	더 나은 방법
초안 URL을 운영용으로 취급	불안정한 콘텐츠와 깨진 임베드	검토된 스냅샷 게시
높이 없이 임베드 배포	레이아웃 이동과 접힌 지도	화면 비율 또는 명시적 크기 설정
주요 지도 지연 로딩	빈 첫 화면	첫 화면 지도를 즉시 로드
`postMessage("*")` 사용	교차 오리진 스푸핑	오리진 검증 및 지정
공유 ID를 비밀 키로 취급	혼란스러운 접근 모델	서버 키를 백엔드에 보관
허용 도메인 검사 생략	예상 밖 호스트 재사용	임베드 오리진 제한
비공개 행을 공개 공유	데이터 유출	게시 전에 권한 부여
편집마다 임베드 ID 변경	호스트 페이지 손상	안정 ID 뒤에서 버전 관리
지도 로드만 측정	제품 품질을 알 수 없음	준비, 선택, CTA, 오류 추적
텍스트 대안 미제공	Viewer 실패 시 빈 페이지	핵심 정보를 HTML에도 제공

최종 결론

지도 게시는 팀이 라이브 지도를 내보내기 파일이 아니라 제품 화면으로 다룰 때 성공합니다. 호스트 콘텐츠 및 애플리케이션 상태와 필요한 결합도에 따라 공유, 임베드, 통합을 선택하세요. 그런 다음 접근, 허용 도메인, 확보된 레이아웃, 오리진 검증 메시징, 버전 관리, 측정, 롤백이라는 운영 계약을 추가합니다. Kaleidr Studio는 현재 독립 페이지와 임베드 위젯을 게시하며, Kaleidr Viewer는 공유 ID로 게시 지도를 지정합니다. 이 분리는 제작을 빠르게 유지하고, 호스트 페이지가 전환, 접근성, 릴리스 규율을 책임지게 합니다.

Kaleidr Studio로 지도 게시하기

지도를 만들고 검토해 독립 페이지 또는 임베드 위젯으로 배포한 뒤, 호스트 사이트에 필요한 곳에 게시 Viewer를 마운트하세요. 게시하려면 **Kaleidr Studio 열기**를 사용하고, Viewer 공유 ID, 허용 도메인, SDK 마운트는 개발자 문서를 참고하세요.

자주 묻는 질문

지도 게시란 무엇인가요?

편집 가능한 지도를 다른 사람이 열거나 임베드하거나 제품 안에서 사용할 수 있는 안정적인 경험으로 바꾸고 접근, 레이아웃, 버전, 측정을 제어하는 과정입니다.

공유 링크와 임베드의 차이는 무엇인가요?

공유 링크는 게시 지도를 독립 페이지로 엽니다. 임베드는 그 지도를 호스트 웹사이트나 제품 레이아웃 안에 배치합니다.

임베드 대신 제품 통합은 언제 사용하나요?

필터, 선택 레코드, 워크플로 상태를 독립 Viewer 주변에 두는 수준을 넘어 지도와 동기화해야 할 때입니다.

Kaleidr Viewer에 API 키가 필요한가요?

현재 문서는 게시 Viewer 지도가 API 키가 아니라 공유 링크로 제한된다고 설명합니다. 접근 모델은 바뀔 수 있으므로 배포 전 최신 문서를 확인하세요.

공유 ID와 API 키는 같은가요?

아닙니다. 공유 ID는 게시 지도 경험을 식별합니다. 서버 API 키는 권한 있는 API 작업을 승인하며 비밀로 유지해야 합니다.

지도 임베드를 지연 로딩해야 하나요?

화면 아래에 있거나 부차적이면 일반적으로 그렇습니다. 지도가 주요 상호작용이면 핵심 경험으로 로드하고 시작을 최적화하세요.

iframe 지도를 접근 가능하게 만들려면 어떻게 하나요?

iframe에 간결한 title을 주고, 유용한 주변 HTML, 키보드 작업, 지도를 드래그하지 않아도 되는 텍스트 정보를 제공하세요.

서로 다른 오리진의 페이지와 임베드 지도가 통신할 수 있나요?

통합이 지원하면 가능합니다. window.postMessage()를 사용해 특정 대상 오리진을 지정하고 수신 메시지의 오리진을 검증하세요.

비공개 비즈니스 데이터를 지도 임베드로 게시할 수 있나요?

게시 및 권한 부여 구조가 그 용도로 설계된 경우에만 가능합니다. 호스트 페이지의 로그인 보호만으로 독립 지도 URL이 비공개가 되지는 않습니다.

게시 지도에 버전 관리가 필요한가요?

변경이 고객, 임베드, 보고, 업무 흐름에 영향을 줄 수 있다면 필요합니다. 버전 관리는 롤백과 디버깅을 훨씬 안전하게 만듭니다.

Kaleidr Studio는 코드 없이 지도를 게시할 수 있나요?

예. 현재 Studio 페이지는 시각적으로 지도를 만들고 다듬은 뒤 독립 페이지나 임베드 위젯으로 게시할 수 있다고 안내합니다.

참고 자료

Kaleidr. Design Custom Maps, Powered by Spatial AI. Kaleidr Studio. 2026년 8월 19일 확인. https://kaleidr.com/studio
Kaleidr. kaleidr.js Loader. Kaleidr Developer Documentation. 2026년 8월 19일 확인. https://docs.kaleidr.com/sdk/kaleidr-js
Kaleidr. Viewer Embed. Kaleidr Developer Documentation. 2026년 8월 19일 확인. https://docs.kaleidr.com/sdk/viewer-embed
WHATWG. HTML Standard — Lazy loading attributes. 2026년 8월 19일 확인. https://html.spec.whatwg.org/multipage/urls-and-fetching.html#lazy-loading-attributes
WHATWG. HTML Standard — The iframe element. 2026년 8월 19일 확인. https://html.spec.whatwg.org/multipage/iframe-embed-object.html#the-iframe-element
W3C. Understanding Success Criterion 4.1.2: Name, Role, Value. WCAG 2.2. 2026년 8월 19일 확인. https://www.w3.org/WAI/WCAG22/Understanding/name-role-value.html
WHATWG. HTML Standard — Posting messages. 2026년 8월 19일 확인. https://html.spec.whatwg.org/multipage/web-messaging.html#posting-messages
web.dev. Lazy load images and iframe elements. 2026년 8월 19일 확인. https://web.dev/learn/performance/lazy-load-images-and-iframe-elements

@misc{kaleidr_studio_publish_2026,
  title  = {Design Custom Maps, Powered by Spatial AI},
  author = {{Kaleidr}},
  note   = {Kaleidr Studio; accessed 19 August 2026},
  url    = {https://kaleidr.com/studio}
}

@misc{kaleidr_viewer_embed_2026,
  title  = {Viewer Embed},
  author = {{Kaleidr}},
  note   = {Kaleidr Developer Documentation; accessed 19 August 2026},
  url    = {https://docs.kaleidr.com/sdk/viewer-embed}
}

@misc{kaleidr_js_loader_2026,
  title  = {kaleidr.js Loader},
  author = {{Kaleidr}},
  note   = {Kaleidr Developer Documentation; accessed 19 August 2026},
  url    = {https://docs.kaleidr.com/sdk/kaleidr-js}
}

@misc{whatwg_iframe_2026,
  title  = {HTML Standard -- The iframe element},
  author = {{WHATWG}},
  note   = {Accessed 19 August 2026},
  url    = {https://html.spec.whatwg.org/multipage/iframe-embed-object.html#the-iframe-element}
}

@misc{wcag_412_2026,
  title  = {Understanding Success Criterion 4.1.2: Name, Role, Value},
  author = {{W3C}},
  note   = {WCAG 2.2; accessed 19 August 2026},
  url    = {https://www.w3.org/WAI/WCAG22/Understanding/name-role-value.html}
}

@misc{whatwg_lazy_loading_2026,
  title  = {HTML Standard -- Lazy loading attributes},
  author = {{WHATWG}},
  note   = {Accessed 19 August 2026},
  url    = {https://html.spec.whatwg.org/multipage/urls-and-fetching.html#lazy-loading-attributes}
}

@misc{whatwg_postmessage_2026,
  title  = {HTML Standard -- Posting messages},
  author = {{WHATWG}},
  note   = {Accessed 19 August 2026},
  url    = {https://html.spec.whatwg.org/multipage/web-messaging.html#posting-messages}
}

@misc{webdev_lazy_iframe_2026,
  title  = {Lazy load images and iframe elements},
  author = {{web.dev}},
  note   = {Accessed 19 August 2026},
  url    = {https://web.dev/learn/performance/lazy-load-images-and-iframe-elements}
}

지도 게시 가이드

지도 게시란 무엇인가요?

게시 지도를 공유, 임베드, 통합 중 어떻게 제공해야 하나요?

운영 임베드는 레이아웃, 접근, 메시징을 어떻게 처리해야 하나요?

게시 지도의 버전을 관리하고 측정하고 롤백하려면 어떻게 해야 하나요?

팀이 피해야 할 지도 게시 실수는 무엇인가요?

최종 결론

Kaleidr Studio로 지도 게시하기

자주 묻는 질문

지도 게시란 무엇인가요?

공유 링크와 임베드의 차이는 무엇인가요?

임베드 대신 제품 통합은 언제 사용하나요?

Kaleidr Viewer에 API 키가 필요한가요?

공유 ID와 API 키는 같은가요?

지도 임베드를 지연 로딩해야 하나요?

iframe 지도를 접근 가능하게 만들려면 어떻게 하나요?

서로 다른 오리진의 페이지와 임베드 지도가 통신할 수 있나요?

비공개 비즈니스 데이터를 지도 임베드로 게시할 수 있나요?

게시 지도에 버전 관리가 필요한가요?

Kaleidr Studio는 코드 없이 지도를 게시할 수 있나요?

참고 자료

관련 콘텐츠

지도를 비즈니스 성장의 동력으로 바꾸세요