<iframe> 태그를 사용하여 공유된 Insights 페이지를 HTML 코드에 임베드할 수 있습니다. 인라인 프레임(iframe)을 사용하면 HTML 문서를 다른 문서(페이지)에 임베드할 수 있습니다. iframe은 다음과 같은 두 가지 방법으로 구성할 수 있습니다. iframe을 최적화하여 ArcGIS StoryMaps에 임베드하거나 웹사이트 또는 다른 ArcGIS 앱에 임베드할 수 있는 iframe을 사용자 정의합니다.
iframe 구성
페이지를 공유하면 iframe이 생성됩니다.
iframe을 구성하려면 다음 단계를 완료하세요.
- 페이지를 공유하려면 다음 단계를 따릅니다.
- 페이지 공유 성공 창의 임베드 아래에서 옵션 버튼을 클릭하여 iframe 옵션을 표시합니다. ArcGIS StoryMaps 또는 사용자 설정 iFrame을 선택합니다.
- 크기에서 메뉴를 열고 크기를 선택합니다.
ArcGIS StoryMaps의 경우 크기 옵션에는 기본값 및 사용자 설정이 있습니다. 사용자 설정 iFrame의 경우 크기 옵션에는 작게, 보통, 크게, 사용자 설정이 있습니다.
- iframe을 복사하려면 복사 버튼을 클릭합니다.
iframe을 HTML 코드 또는 iframe 임베드를 지원하는 앱에 복사할 수 있습니다.
ArcGIS StoryMaps iframe
공유 페이지를 최적화하여 StoryMaps에 임베드할 수 있습니다.
스토리 빌더의 임베드 블록에는 작게, 보통, 크게라는 세 가지 크기 옵션이 있습니다. StoryMaps에 최적화된 iframe은 블록의 너비를 채웁니다. 최상의 결과를 얻으려면 임베드 블록의 크기와 Insights 페이지의 너비를 다음과 같이 조정합니다.
블록 크기 임베드 | Insights 페이지 최대 너비 |
---|---|
작게 | 기본 크기의 카드 2개 |
보통 | 기본 크기의 카드 3개 |
크게 | 기본 크기의 카드 4개 |
Insights 페이지 크기가 임베드 블록보다 넓은 경우에는 스크롤 막대가 나타납니다.
다음 iframe 크기는 ArcGIS StoryMaps iframe에 사용할 수 있습니다.
크기 | 디멘전 | 설명 |
---|---|---|
기본 | 너비 = 100% 높이 = 100% | iframe의 크기는 스토리 빌더에서 임베드 블록의 기본 크기(작게, 보통, 크게)에 맞게 조정됩니다. |
사용자 설정 | 너비 = 100% 높이 = 페이지의 카드 높이 | iframe의 크기는 Insights 페이지에서 카드 높이 및 임베드 블록(작게, 보통, 크게)의 너비입니다. 사용자 설정 iframe의 높이는 편집할 수 있으며 픽셀과 백분율을 모두 지원합니다. |
사용자 설정 iframe
사용자 설정 iframe은 ArcGIS Experience Builder, ArcGIS Dashboards, ArcGIS Hub 등의 ArcGIS 제품과 웹사이트를 포함하여 대부분의 HTML 코드에 임베드할 수 있습니다.
비고:
Experience Builder에 Insights 콘텐츠를 임베드할 때 소형 및 중형 기기에서 보기를 최적화하려면 작은 iframe에서 단일 카드를 사용하는 것을 권장합니다.
다음 iframe 크기는 사용자 설정 iframe에 사용할 수 있습니다.
크기 | 디멘전 | 설명 |
---|---|---|
작게 | 너비 = 420픽셀 높이 = 420픽셀 | 기본 크기의 단일 맵, 차트 또는 테이블 카드 크기입니다. 공유 페이지가 iframe 크기보다 크면 스크롤 막대가 나타납니다. |
보통 | 너비=830픽셀 높이=830픽셀 | 기본 크기의 카드 4개 크기이며 두 카드의 두 행으로 구성됩니다. 공유 페이지가 iframe 크기보다 크면 스크롤 막대가 나타납니다. |
크게(기본값) | 너비 = 100% 높이 = 100% | HTML 코드에서 iframe 요소의 전체 크기입니다. |
사용자 설정 | 너비 = 페이지의 카드 너비 높이 = 페이지의 카드 높이 | 페이지의 카드 크기(픽셀)이므로 스크롤 막대 없이 전체 페이지가 표시됩니다. 사용자 설정 iframe의 높이와 너비는 편집할 수 있으며 픽셀과 백분율을 모두 지원합니다. |
리소스
다음 리소스를 사용하여 ArcGIS 앱에 iframe을 임베드하는 방법에 대해 자세히 알아봅니다.
- ArcGIS Hub에 비디오, 소셜 미디어, iframe 임베드
- ArcGIS Experience Builder에 위젯 임베드
- ArcGIS StoryMaps에 미디어 추가
- Insights iframe 가이드
- ArcGIS Dashboards의 서식 있는 텍스트