
개요
3D 지역 탐색기 솔루션은 완전히 새로운 방식으로 위치를 탐색하고 경험할 수 있는 방법을 제공합니다. 이 솔루션은 Google Maps Platform 포토리얼리스틱 3D 타일 및 Places API의 기능을 활용하여 매력적인 양방향 3D 환경을 만듭니다.
3D 지역 탐색기는 다음과 같은 다양한 용도로 설계되었습니다.
지역 탐색 개선: 사용자는 시각적 세부정보를 통해 주변 지역을 가상으로 탐색하여 지역 특성과 명소에 대한 유용한 정보를 얻을 수 있습니다.
위치 기반 내러티브 홍보: 풍부한 설명과 함께 관심 장소(POI)를 통합하는 기능을 통해 특정 위치에 대해 사용자에게 교육하고 정보를 제공하는 내러티브 기반 환경을 만들 수 있습니다.
Google 지도 3D 기능을 사용한 개발 촉진: 몰입형 대화형 지도를 만들기 위한 Google의 3D 매핑 데이터의 잠재력을 보여줍니다.
시작하기
사용 설정
핵심 기술
이 솔루션은 두 가지 주요 기술을 사용하여 빌드됩니다.
Google Maps Platform API
Google Maps Platform의 여러 API를 사용하여 기본 지도와 데이터를 가져와 이 환경을 만듭니다.
- Google 지도 포토리얼리스틱 3D 타일: 건물과 지형의 고해상도 3D 모델은 도시 환경을 사실적이고 시각적으로 매력적으로 표현합니다.
- Places API: 앱은 탐색된 지역 내 관심 장소 (POI)에 관한 세부정보를 식별하고 표시하여 현지 지식으로 사용자 환경을 개선할 수 있습니다.
- 자동 완성은 사용자가 특정 위치나 관심 지역을 검색하는 데 도움이 됩니다.
CesiumJS
CesiumJS는 고해상도 3D 지구를 렌더링하고 표시하는 역할을 합니다. 건물과 지형의 3D 메시 모델을 제공하는 Google의 포토리얼리스틱 3D 타일의 로드 및 시각화를 처리합니다.
카메라 관리: CesiumJS는 카메라의 위치, 방향, 움직임을 제어하는 도구를 제공합니다. 여기에는 다음이 포함됩니다.
- 앱 로드 시 지정된 주변 지역에 초점을 맞추도록 초기 시점을 설정합니다.
- 탐색을 위한 자동화된 궤도 애니메이션과 같은 동적 카메라 움직임을 구현합니다.
- 지구본과 사용자 상호작용 처리(화면 이동, 확대/축소, 회전)
포토리얼리스틱 3D 타일이 3D 타일 렌더러와 함께 작동하는 방법을 알아보세요.
주요 구성요소
애플리케이션은 다음과 같은 두 가지 앱으로 나뉩니다.
- 관리자 앱
- 데모 앱
이 다이어그램은 두 애플리케이션 간의 차이점과 상관관계를 간략하게 보여줍니다.

각 앱을 자세히 조사하는 것이 좋습니다.
관리자 앱
이 애플리케이션은 3D 환경을 맞춤설정할 수 있는 사용자 친화적인 인터페이스를 제공합니다.
위치 검색 : 통합된 Google Maps Platform 자동 완성 검색창을 사용하여 표시할 지역을 찾습니다. 위치를 선택하면 카메라가 해당 영역으로 원활하게 이동합니다.
카메라: 카메라 이동 속도와 궤도 유형을 조정하여 선택한 보기 환경을 만듭니다.
장소 (관심 장소): 표시할 관심 장소 (예: 음식점, 카페, 명소)의 밀도, 검색 반경, 유형을 정의합니다.
이 앱을 사용하여 최종 사용자의 환경을 맞춤설정하세요.
Google 시카고 사무실을 천천히 둘러보는 카메라 경로를 살펴보세요.
라스베이거스 스트립 주변 관광 명소의 밀집된 뷰를 참고하세요.
이제 고속 정현파 카메라 경로를 따라 라스베이거스를 탐색해 보겠습니다.
모든 주요 관광 명소가 있는 그랜드 캐니언 둘러보기
3D Area Explorer 맞춤설정에 모든 맞춤설정에 대한 자세한 설명이 있습니다.
데모 앱
관리자 앱에서 만든 구성을 로드하는 최종 사용자 대상 애플리케이션입니다. 이 몰입형 3D 환경에서 사용자는 선택한 영역을 탐색하고 강조 표시한 장소를 발견할 수 있습니다.
관리자 앱을 사용하여 디자인과 분위기를 맞춤설정한 후에는 구성을 다운로드하고 소스 코드에서 맞춤 애플리케이션을 실행할 수 있습니다.
사용자 환경

애플리케이션의 주요 기능은 다음과 같습니다.
- 사용자는 건물, 명소, 지형을 포함한 지역을 3D로 대화형으로 탐색할 수 있습니다.
- 사용자는 주변 장소 (예: 박물관, 공원, 음식점)를 검색하고 탐색할 수 있습니다.
사용자는 장소를 선택하면 해당 위치와 관련된 세부정보나 설명을 볼 수 있습니다.
개발자는 설정 및 제어 (관리자 앱을 사용하는 경우)를 통해 탐색 환경을 맞춤설정할 수 있습니다.
자동 회전이 사용 설정되어 카메라가 선택한 영역의 중심을 기준으로 자동으로 회전할 수 있습니다.
기본 요건
Google 지도 API 키: 다음 API가 사용 설정된 유효한 API 키가 필요합니다.
웹 서버: 다음 중 하나에서 애플리케이션을 제공할 수 있습니다.
- 로컬 웹 서버 (예: Node.js, http-server 사용)
- 정적 웹 호스팅 서비스 (애플리케이션에 Dockerfile이 포함됨)
GitHub 프로젝트의 readme 섹션에서 배포 옵션에 대한 자세한 설명을 확인할 수 있습니다.
배포
GKE 또는 GAE와 같은 컨테이너 환경에서 앱을 노드 애플리케이션 또는 Docker 컨테이너로 배포할 수 있습니다. 호스팅된 데모는 다음 아키텍처를 사용합니다.

- 이 아키텍처에서 코드는 GitHub 프로젝트에 있습니다.
- Cloud Build는 기본 브랜치에 푸시된 코드를 가져와 빌드 작업을 트리거합니다.
- 빌드의 일부로 API 키를 삽입하고 이미지를 만든 후 Artifact Registry에 저장합니다.
- 마지막으로 Artifact Registry의 최신 안정화 버전 이미지를 Cloud Run에 배포합니다.
- 또한 배포된 앱의 상태를 확인하기 위해 상태 점검 및 모니터링을 실행하고 있습니다.
청구 정보
3D 지역 탐색기 솔루션은 Google Maps Platform 서비스를 사용하여 몰입형 동적 환경을 제공합니다. 일부 API는 요금이 부과될 수 있습니다. 다음은 API 개요와 가격 책정 링크입니다.
Google Maps Platform - 3D Tiles API
3D 지역 탐색기 솔루션은 3D Tiles API를 활용하여 지리 공간 데이터로 시각적 경험을 개선합니다. 3D Tiles API와 관련된 가격 책정 세부정보는 Google Maps Platform - 3D Tiles API 가격 책정을 참고하세요.
Google Maps Platform - Places API
Places API는 위치 기반 데이터에 사용되어 3D Area Explorer 환경에 풍부한 정보를 추가합니다. Google Places API와 관련된 비용을 알아보려면 Google Maps Platform - Places API 가격 책정을 참고하세요.
Google Maps Platform - Autocomplete API
자동 완성 기능은 사용자 상호작용을 개선합니다. Google Maps Autocomplete API의 가격 책정에 관한 자세한 내용은 Google Maps Platform - Place Autocomplete 가격 책정을 참고하세요.
CesiumJS
CesiumJS는 3D 지구 시각화에 사용됩니다. CesiumJS 자체는 오픈소스이지만 추가 기능이나 서비스에는 자체 관련 비용이 있을 수 있습니다. 프리미엄 서비스는 CesiumJS 문서를 참고하세요.
요금은 사용량에 따라 개별적으로 결정되므로 각 API의 가격 책정 세부정보를 검토하는 것이 중요합니다. Google Maps Platform은 일정량의 사용량을 무료로 제공하는 무료 등급을 제공하며, 구체적인 가격은 요청 수, 사용 지역 등의 요인에 따라 달라질 수 있습니다.
Google Maps Platform 및 CesiumJS 사용 비용에 관한 가장 정확한 최신 정보는 항상 공식 가격 책정 페이지를 참고하세요. 이러한 서비스에서 명시한 이용약관을 준수하여 관련 비용을 효과적으로 관리하고 이해해야 합니다.
결론
이 문서에서는 3D Area Explorer의 기능, 구성요소, 사용자 환경, 기술 요구사항을 간략하게 설명합니다.
Google의 포토리얼리스틱 3D 타일과 Places API를 활용하여 주변 지역을 가상으로 탐색하고, 관심 장소를 발견하고, 지역 역사에 대해 알아볼 수 있습니다.
3D Area Explorer는 지역을 보여주거나, 탐색을 개선하거나, 디지털 스토리텔링을 홍보하는 등 시각적으로 뛰어난 플랫폼을 제공합니다.
데모를 사용해 보고 관리자 앱을 사용하여 맞춤설정하여 흥미롭고 유익한 3D 환경을 만드세요.