본문으로 건너뛰기

Tile

Tile 제품은 디자인된 Kaleidr 베이스맵을 Kaleidr가 호스팅하는 iframe 안에서 렌더링합니다. Free 계정에서 사용할 수 있는 유일한 키 기반 제품으로, publishable 키에는 기본적으로 maps 범위와 tile 제품 권한이 포함됩니다.

작동 여부를 결정하는 세 가지 요소

요소설명
통합 방식iframe — 지도는 Kaleidr 자체 CSP 아래 map-embed.kaleidr.com 내부에서 로드됩니다.
필수 범위maps.
최소 플랜Free — Free 키는 ["maps"] 범위와 ["tile"] 제품 권한으로 생성됩니다.

지도가 Kaleidr iframe 안에서 렌더링되므로 Tile만 임베드하는 경우 부모 페이지의 CSP에는 지도 / tile / vendor image host가 필요하지 않습니다. 같은 페이지에서 Chat이나 Editor도 실행하는 경우에만 해당 host가 필요합니다 — Content Security Policy를 참조하세요.

각 구성 요소의 위치

  • SDK 레퍼런스Tile — 속성 (style-id, center, zoom, pitch, bearing), handle matrix, setStyle.
  • 가이드Tile 사용 — style picker, camera pass-through, self-hosting 참고 사항.

하나의 스니펫

최소 구성 Tile 임베드:

<script src="https://cdn.kaleidr.com/embed/v1/kaleidr.js"></script>
<kaleidr-map product="tile"
publishable-key="kld_pk_live_…"
style-id="kaleidr-morning"
style="height:480px"></kaleidr-map>

style-id를 생략하면 viewer의 기본 canvas 값이 사용됩니다. 전체 style URL도 사용할 수 있습니다.