Skip To Content

사이트의 레이아웃 디자인

사이트 구성 후 데이터를 추가하면 홈페이지 레이아웃을 디자인하고 머리글와 바닥글을 사용자 정의할 수 있습니다. 이 작업은 모두 사이트 편집기 탭에서 이루어집니다. 이 탭에서 제공된 편집기, 마크다운 또는 사용자 정의 HTML을 사용하여 사이트를 디자인할 수 있습니다.

개요

사이트 편집기는 사이트 템플릿이 제공되는 전체 페이지 편집기입니다. 이 사이트 템플릿을 수정하여 사용자 사이트의 브랜드 이미지와 데이터에 맞추거나 사이트 템플릿을 완전히 제거하여 처음부터 만들 수 있습니다. 페이지의 요소 위에 마우스를 놓고 요소를 이동, 크기 조정, 편집 또는 삭제하거나 왼쪽 상단에 있는 기어 아이콘을 클릭하여 사이트 편집기 측면 패널을 엽니다.

헤더 설정

사이트 헤더는 로고 URL과 사이트 제목을 사용하는 간단한 방법이나 사용자 정의 HTML 및 CSS를 사용하는 고급 방법으로 구성할 수 있습니다.

    간단한 워크플로
  1. 로고 및 사이트 제목 사용을 선택합니다.
  2. 사이트 제목 아래에 제목을 입력합니다.
  3. 로고 URL 아래에 이미지를 입력합니다. 이미지는 50픽셀 높이에 맞게 크기가 조정됩니다.
    고급 워크플로
  1. 사용자 정의 HTML/CSS 사용을 선택합니다.

    기본 헤더가 페이지에 나타나며 CSS 상자가 측면 패널에 나타납니다.

  2. 헤더의 오른쪽 상단에 있는 기어 아이콘을 클릭하여 HTML을 편집합니다.
  3. 기어 아이콘을 다시 클릭하여 변경 내용을 확인합니다.
  4. 측면 패널의 CSS 상자를 수정한 후 변경 사항 적용을 클릭하여 HTML 결과를 확인합니다.
주의:

HTML 헤더에는 임베드된 JavaScript가 지원되지 않습니다. 스크립트 태그가 무시됩니다.

참고 사항:

사이트의 기능을 유지하기 위해서는 내 데이터로그인 영역을 편집하거나 제거할 수 없습니다.

테마 빌더

다음과 같은 색상 옵션으로 사이트의 테마를 지정합니다.

  • 헤더 배경 색상 - 헤더에 적용됩니다.
  • 헤더 텍스트 색상 - 헤더 텍스트에 적용됩니다.
  • 본문 배경 색상 - 투명한 홈페이지 행의 색상과 검색 결과 페이지 및 데이터셋 페이지의 배경 색상에 적용됩니다.
  • 본문 텍스트 색상 - 사이트 전반에 걸쳐 일반 텍스트의 색상에 적용됩니다.
  • 본문 링크 색상 - 사이트 전반의 색상 링크 및 버튼과 헤더에 있는 링크에 대한 마우스 놓기 상태에 적용됩니다.

팁:

텍스트 색상을 행별로 변경할 수도 있습니다.

레이아웃 빌더

페이지의 기본 레이아웃은 행과 위젯으로 구성됩니다. 위젯은 행에 배치되어야 합니다. 행에 배치할 수 있는 위젯의 수에는 제한이 없습니다. 카드를 편집하려면 기어 아이콘을 클릭합니다. 카드를 삭제하려면 휴지통 아이콘을 클릭합니다.

행을 사용하여 전체 레이아웃을 구성하고 위젯을 행에 배치합니다.

  1. 측면 패널의 행을 페이지에 드래그합니다.

    그러면 페이지에 안내를 위한 표시가 나타납니다.

  2. 이 행 위에 마우스를 놓으면 오른쪽에 3개의 아이콘 즉, 페이지에서의 행 이동을 위한 화살표, 행 편집을 위한 기어 아이콘, 행 삭제를 위한 x가 나타납니다.
  3. 기어 아이콘을 클릭하면 편집 모드로 전환됩니다.
  4. 이 특정 행의 텍스트 색상을 설정합니다.
  5. 배경 색상(기본 설정은 투명) 또는 배경 이미지를 설정합니다.
  6. 기본 측면 패널로 돌아가려면 사이트 편집기로 돌아가기를 클릭합니다.

배너 카드

사이트 내의 머리글 및 검색 바에 배너를 사용합니다.

  1. 배너 위젯을 기존 행에 드래그합니다.
  2. 이 위젯 위에 마우스를 놓고 기어 아이콘을 클릭하여 편집 모드로 전환합니다.
  3. 필요한 경우 머리글과 하위 머리글을 입력합니다.
  4. 필요한 경우 배경 이미지 URL을 입력하고 최소 높이를 설정합니다.
  5. 필요한 경우 검색바 보기를 선택하여 검색바를 이 배너 위젯에 추가합니다.
  6. 필요한 경우 위치별 검색 기능 추가를 선택하여 사용자가 위치별로 결과를 필터링할 수 있는 보조 검색 옵션을 추가합니다.
  7. 필요한 경우 검색 바에 나타날 플레이스 홀더 텍스트를 추가합니다.
  8. 기본 측면 패널로 돌아가려면 사이트 편집기로 돌아가기를 클릭합니다.

이미지 카드

레이아웃에 이미지를 사용할 수 있습니다.

  1. 이미지 위젯을 기존 행에 드래그합니다.
  2. 이 위젯 위에 마우스를 놓고 기어 아이콘을 클릭하여 편집 모드로 전환합니다.
  3. 이미지 URL을 제공합니다.
  4. 이미지 대체 텍스트를 제공하면 시력이 약한 사용자에게 도움을 주고 사이트의 접근성을 향상시킬 수 있습니다.
  5. 필요한 경우 이미지 캡션을 제공합니다.
  6. 필요한 경우 같은 탭 또는 새 탭에서 열 수 있는 이미지 하이퍼링크를 제공합니다.
  7. 기본 측면 패널로 돌아가려면 사이트 편집기로 돌아가기를 클릭합니다.

텍스트 카드

레이아웃에 마크다운(Markdown) 및 HTML 형식의 텍스트를 추가합니다.

  1. 텍스트 위젯을 기존 행에 드래그합니다.
  2. 이 위젯 위에 마우스를 놓고 기어 아이콘을 클릭하여 편집 모드로 전환합니다.
  3. 마크다운 또는 HTML 텍스트를 텍스트 위젯에 입력합니다.
  4. 기어 아이콘을 클릭하여 텍스트를 확인합니다.
주의:

보안을 위해 텍스트 위젯에는 임베드된 자바스크립트가 지원되지 않습니다. 스크립트 태그가 무시됩니다.

다음의 HTML 요소가 허용됩니다.

'a', 'b', 'blockquote', 'br', 'caption', 'cite', 'code', 'col',
 'colgroup', 'dd', 'dl', 'dt', 'em', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
 'i', 'img', 'li', 'ol', 'p', 'pre', 'q', 'small', 'strike', 'strong',
 'sub', 'sup', 'table', 'tbody', 'td', 'tfoot', 'th', 'thead', 'tr', 'u',
 'ul', 'center', 'style', 'div', 'span'

이러한 요소에는 다음과 같은 속성이 허용됩니다.

All supported HTML elements allow : ['class', 'style'], 'a' : ['href', 'title', 'target', 'data-toggle', 'data-target', 'name'], 'blockquote': ['cite'],	'button'    : ['name', 'value', 'data-toggle', 'data-target', 'data-dismiss'], 'col' : ['span', 'width'], 'colgroup' : ['span', 'width'],	'div' : ['data-show', 'data-target', 'data-toggle'] 'img' : ['align', 'alt', 'height', 'src', 'title', 'width' ], 'ol' : ['start', 'type'], 'q' : ['cite'], 'table' : ['summary', 'width', 'class'], 'td' : ['abbr', 'axis', 'colspan', 'rowspan', 'width'], 'th' : ['abbr', 'axis', 'colspan', 'rowspan', 'scope', 'width'],
 'ul' : ['type']

범주 카드

범주를 사용하여 사이트의 데이터셋을 그룹화합니다.

  1. 범주 위젯을 기존 행에 드래그합니다.
  2. 이 위젯 위에 마우스를 놓고 기어 아이콘을 클릭하여 편집 모드로 전환합니다.
  3. 범주의 링크 텍스트를 편집합니다.
  4. 태그 쿼리 또는 그룹을 선택합니다.

    이 선택에 따라 사용자가 이 범주를 클릭했을 때 검색 결과에 반환되는 데이터셋이 결정됩니다.

    • 태그 - 태그 쿼리를 입력합니다. .해당 엔터프라이즈 포털 항목에 일치하는 태그가 있는 모든 데이터셋이 검색 결과에 반환됩니다.
    • 그룹 - 그룹을 선택합니다. 이 그룹 내의 모든 데이터셋이 검색 결과에 반환됩니다.
  5. 라이브러리에서 아이콘을 선택하는 경우:
    1. 아이콘 선택을 선택합니다.
    2. 모달에서 아이콘을 선택하고 선택을 클릭합니다.

      이 아이콘이 측면 패널에 표시됩니다.

    3. 아이콘 오른쪽에 있는 회색 상자를 클릭하여 아이콘의 색상을 선택합니다.
  6. 사용자 고유의 아이콘을 사용하는 경우:
    1. 아이콘의 URL을 제공합니다.
    2. 아이콘에 대한 대체 텍스트를 제공하면 시력이 약한 사용자에게 도움을 주고 사이트의 접근성을 향상시킬 수 있습니다.
  7. 기본 측면 패널로 돌아가려면 사이트 편집기로 돌아가기를 클릭합니다.
팁:

사용자 정의 아이콘은 .svg 또는 투명한 .png 파일로 저장해야 합니다. 아이콘은 120x120픽셀에 맞게 크기가 조정됩니다.

연락처 정보 카드

데이터 소유자에게 이메일을 보낼 연락처 정보를 제공합니다.

  1. 연락처 위젯을 기존 행에 드래그합니다.
  2. 이 위젯 위에 마우스를 놓고 기어 아이콘을 클릭하여 편집 모드로 전환합니다.
  3. 담당자 이메일 주소와 이메일 제목란을 제공합니다.

    사용자가 홈페이지에서 이메일을 클릭하면 사용자의 이메일 편집기가 자동으로 열립니다.

  4. 기본 측면 패널로 돌아가려면 사이트 편집기로 돌아가기를 클릭합니다.

iframe 카드

iframe 및 외부 리소스를 임베드합니다.

  1. iframe 위젯을 기존 행에 드래그합니다.
  2. 이 위젯 위에 마우스를 놓고 기어 아이콘을 클릭하여 편집 모드로 전환합니다.
  3. iframe URL 및 iframe 높이를 제공합니다.
  4. 적용을 클릭합니다.
주의:

다른 웹 사이트의 임베드 가능한 iframe 코드를 붙여넣지 마세요. 임베드하려는 URL만 붙여넣어야 합니다.

팁:

HTTP가 사용된 iframe URL은 HTTPS가 사용되는 사이트 편집기에 나타나지 않습니다. 사이트를 저장한 후 확인하여 iframe이 제대로 나타나는지 살펴봅니다.

차트 카드

데이터셋을 사용하여 간단한 차트를 직접 생성하거나 사용자 자신의 차트 JSON을 입력하여 사용자 정의 차트를 생성합니다.

막대형 차트

막대형 차트는 선택한 데이터셋에 대한 쿼리를 통해 생성되며 데이터셋이 업데이트되면 자동으로 업데이트됩니다.

  1. 차트 위젯을 기존 행에 드래그합니다.
  2. 이 위젯 위에 마우스를 놓고 기어 아이콘을 클릭하여 편집 모드로 전환합니다.
  3. 기본 설정에 따라 막대형 차트가 선택됩니다.
  4. 데이터 추가(+)를 클릭합니다.
  5. 사용 가능한 서비스에서 항목을 선택합니다.
  6. 범주 속성 선택을 선택하여 데이터의 기본 차트 항목을 선택합니다.

    차트에서 숫자 및 문자열 필드를 사용할 수 있습니다. 기본 설정에 따라 범주 속성을 선택하면 결과 차트는 이 속성의 개수가 됩니다.

  7. 필요한 경우 값 속성 선택을 사용하여 범주 속성의 값 메트릭으로 적용할 숫자 필드를 선택합니다. 선택하면 이 필드의 기본 통계 연산은 합계가 됩니다. 값 속성 선택 선택기의 오른쪽 드롭다운을 사용하여 통계 연산을 변경할 수 있습니다. 값 속성은 최소, 최대, 합계, 평균 및 개수를 지원합니다. 개수를 선택하면 값 속성이 선택 취소됩니다(범주 속성을 계산할 추가 필드가 필요하지 않으므로).

    차트에서 숫자 및 문자열 필드를 사용할 수 있습니다. 기본 설정에 따라 범주 속성을 선택하면 결과 차트는 이 속성의 개수가 됩니다.

  8. 필요한 경우 옵션 섹션에서 차트 제목, 높이(픽셀), x축 범주 레이블 및 y축 레이블의 값 레이블을 활성화/비활성화하고 사용자 정의할 수 있습니다.

파이 차트

파이 차트는 선택한 데이터셋에 대한 쿼리를 통해 생성되며 데이터셋이 업데이트되면 자동으로 업데이트됩니다.

  1. 차트 위젯을 기존 행에 드래그합니다.
  2. 이 위젯 위에 마우스를 놓고 기어 아이콘을 클릭하여 편집 모드로 전환합니다.
  3. 원형 파이 아이콘을 클릭하여 파이 차트를 선택합니다.
  4. 데이터 추가(+)를 클릭합니다.
  5. 사용 가능한 서비스에서 항목을 선택합니다.
  6. 범주 속성 선택을 선택하여 데이터의 기본 차트 항목을 선택합니다.

    차트에서 숫자 및 문자열 필드를 사용할 수 있습니다. 기본 설정에 따라 범주 속성을 선택하면 결과 차트는 이 속성의 개수가 됩니다.

  7. 필요한 경우 값 속성 선택을 사용하여 범주 속성의 값 메트릭으로 적용할 숫자 필드를 선택합니다. 선택하면 이 필드의 기본 통계 연산은 합계가 됩니다. 값 속성 선택 선택기의 오른쪽 드롭다운을 사용하여 통계 연산을 변경할 수 있습니다. 값 속성은 최소, 최대, 합계, 평균 및 개수를 지원합니다. 개수를 선택하면 값 속성이 선택 취소됩니다(범주 속성을 계산할 추가 필드가 필요하지 않으므로).

    차트에서 숫자 및 문자열 필드를 사용할 수 있습니다. 기본 설정에 따라 범주 속성을 선택하면 결과 차트는 이 속성의 개수가 됩니다.

  8. 필요한 경우 옵션 섹션에서 차트 제목, 높이(픽셀), 도구 설명의 각 파이 쐐기(Wedge) 레이블의 범주 레이블 및 도구 설명의 메트릭 레이블의 값 레이블을 활성화/비활성화하고 사용자 정의할 수 있습니다.

JSON 차트

사용자 정의 차트는 특정 차트 사양이 사용된 JSON을 통해 생성됩니다.

  1. 차트 위젯을 기존 행에 드래그합니다.
  2. 이 위젯 위에 마우스를 놓고 기어 아이콘을 클릭하여 편집 모드로 전환합니다.
  3. JSON 타일 선택
  4. JSON 차트 사양 필드에 JSON을 입력합니다.
  5. 필요에 따라 옵션 섹션에서 차트 제목높이(픽셀)를 활성화/비활성화하고 사용자 정의할 수 있습니다.

JSON 사양

사용자 정의 JSON을 입력하면 Cedar 라이브러리를 활용하는 사용자 정의 차트를 생성할 수 있습니다. 사양은 다음과 같은 요소로 구성됩니다.

데이터셋

데이터셋 배열은 ArcGIS 피처 서비스 URL과 쿼리 매개변수를 지정합니다. 쿼리 매개변수에 대한 자세한 내용은 REST API 설명서를 참조하세요.

{ "datasets": [ { "url": "SampleArcGISFeatureService_URL", "name" : "Number_of_SUM",
"query": { "groupByFieldsForStatistics": "Zip", "outStatistics": [{
"statisticType": "sum", "onStatisticField": "Number_of",
"outStatisticFieldName": "Number_of_SUM" }] } } ]
}

계열

계열 배열을 사용하면 서비스 응답의 필드 간 매핑과 차트의 시각적 요소(산점도 차트의 경우 x, y축, 색상/크기, 원형 차트의 경우 반경)를 지정할 수 있습니다.

{ "series": [ { "source": "Number_of_SUM", "category": { "field": "Type", "label": "Facility
Use" }, "value": { "field":"Number_of_SUM","label":"Total Students" }} ] }

덮어쓰기

덮어쓰기 등록정보를 사용하면 전체 차트에 대한 시각적 덮어쓰기(예: 색상 또는 위치 지정 등)를 지정할 수 있습니다.

"overrides": {
      "legend": {
          "enabled": true
      },
      "backgroundColor": "#E6E6FA",
      "backgroundAlpha": 1
  }
}

사양

사양 등록정보를 사용하면 사용자 정의 차트에 대한 완전한 시더(Cedar) 사양을 입력할 수 있습니다. 기존 차트 사양에 대해서는 예시를 확인하세요.

예시

막대형 차트:
{
  "type": "bar",
  "datasets": [
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Number_of_SUM",
      "query": {
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [
          {
            "statisticType": "sum",
            "onStatisticField": "Number_of",
            "outStatisticFieldName": "Number_of_SUM"
          }
        ]
      }
    }
  ],
  "series": [
    {
      "category": {"field": "Type", "label": "Type"},
      "value": {"field": "Number_of_SUM", "label": "Number of Students"},
      "source": "Number_of_SUM"
    }
  ]
}

수평 막대형 차트:
{
  "type": "bar-horizontal",  "datasets": [    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",      "name": "Number_of_SUM",      "query": {
        "orderByFields": "Number_of_SUM DESC",        "groupByFieldsForStatistics": "Type",        "outStatistics": [          {
            "statisticType": "sum",            "onStatisticField": "Number_of",            "outStatisticFieldName": "Number_of_SUM"
          }
        ]      }
    }
  ],  "series": [    {
      "category": {"field": "Type", "label": "Type"},      "value": {"field": "Number_of_SUM", "label": "Number of Students"},      "source": "Number_of_SUM"
    }
  ],  "overrides": {
    "categoryAxis": {
      "labelRotation": -45    }
  }
}

그룹 막대형 차트:

참고: 각 계열은 '그룹'과 일치됩니다.

{
  "type": "bar",
  "datasets": [
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Jordan",
      "query": {
        "where": "City='Jordan'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Dewitt",
      "query": {
        "where": "City='Dewitt'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Fayetteville",
      "query": {
        "where": "City='Fayetteville'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    }
  ],
  "series": [
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Jordan Students"},
      "source": "Jordan"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Dewitt Students"},
      "source": "Dewitt"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Fayetteville Students"},
      "source": "Fayetteville"
    }
  ]
}

산점도 차트:
{
  "type": "bar",
  "datasets": [
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Jordan",
      "query": {
        "where": "City='Jordan'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Dewitt",
      "query": {
        "where": "City='Dewitt'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Fayetteville",
      "query": {
        "where": "City='Fayetteville'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    }
  ],
  "series": [
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Jordan Students"},
      "source": "Jordan"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Dewitt Students"},
      "source": "Dewitt"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Fayetteville Students"},
      "source": "Fayetteville"
    }
  ]
}

버블 산점도 차트:
{
  "type": "bar",
  "datasets": [
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Jordan",
      "query": {
        "where": "City='Jordan'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Dewitt",
      "query": {
        "where": "City='Dewitt'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Fayetteville",
      "query": {
        "where": "City='Fayetteville'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    }
  ],
  "series": [
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Jordan Students"},
      "source": "Jordan"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Dewitt Students"},
      "source": "Dewitt"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Fayetteville Students"},
      "source": "Fayetteville"
    }
  ]
}

타임라인 차트

참고: 범주는 날짜와 시간 필드여야 합니다.

{
  "type": "bar",
  "datasets": [
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Jordan",
      "query": {
        "where": "City='Jordan'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Dewitt",
      "query": {
        "where": "City='Dewitt'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Fayetteville",
      "query": {
        "where": "City='Fayetteville'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    }
  ],
  "series": [
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Jordan Students"},
      "source": "Jordan"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Dewitt Students"},
      "source": "Dewitt"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Fayetteville Students"},
      "source": "Fayetteville"
    }
  ]
}

요약 통계 카드

요약 통계를 사용하여 핵심성과지표(KPI) 등에 대한 데이터를 한눈에 파악할 수 있습니다. 요약 통계는 데이터셋 쿼리를 통해 생성되며 데이터셋이 업데이트되면 자동으로 업데이트됩니다.

  1. 요약 통계 위젯을 기존 행에 드래그합니다.
  2. 이 위젯 위에 마우스를 놓고 기어 아이콘을 클릭하여 편집 모드로 전환합니다.
  3. 항목 선택기를 실행하여 원하는 데이터 서비스를 찾으려면 데이터 추가(+)를 클릭합니다.
  4. 선택한 서비스에서 필드를 선택하려면 통계 필드를 선택합니다. 이 필드는 다음 단계에서 사용됩니다.
  5. 선택한 필드에서 수행할 작업의 유형을 선택하려면 통계 유형을 선택합니다.
    • 텍스트 및 날짜 필드의 경우 - 개수, 최소값 또는 최대값을 선택합니다.
    • 숫자 필드의 경우 - 개수, 합계, 최소값, 최대값, 평균, 표준편차 또는 분산을 선택합니다.
  6. 필요한 경우 다음과 같이 통계에 필터를 추가합니다.
    1. 필터에 사용할 속성을 선택합니다.
    2. 추가를 선택합니다.
    3. 필터 입력이 표시될 새 속성 상자를 선택합니다. 입력 상자는 필드 유형에 따라 달라집니다.
    4. 원하는 필터를 입력합니다.
    5. 필터 상자 바깥쪽을 클릭하거나 키보드에서 Enter 키를 누릅니다.
  7. 제목을 입력하세요.
  8. 필요한 경우 후행 텍스트를 입력하고 통계 자체의 강조 색상을 변경합니다.

갤러리 카드

갤러리 카드를 사용하여 사이트의 웹 매핑 응용프로그램 및 웹 맵 콘텐츠를 추천합니다. 갤러리 카드는 기관 그룹의 응용프로그램 및 웹 맵을 자동으로 검색합니다. 앱 및 맵 콘텐츠를 기관이나 특정 그룹에 추가하는 경우 레이아웃을 편집하지 않아도 새 응용프로그램 타일이 사이트에 나타납니다.

  1. 갤러리 카드 위젯을 기존 행에 드래그합니다.
  2. 이 위젯 위에 마우스를 놓고 기어 아이콘을 클릭하여 편집 모드로 전환합니다.
  3. 왼쪽에 몇 가지 옵션이 나타납니다. 을 클릭하면 기관 내의 모든 응용프로그램이 갤러리 카드에 반환됩니다. 데이터셋을 클릭하면 기관 내의 모든 데이터셋이 갤러리 카드에 반환됩니다. 사이트를 클릭하면 기관의 모든 사이트가 갤러리 카드에 반환됩니다.
  4. 표시된 카드 수의 값을 조정하여(최대값은 16) 디스플레이를 변경합니다.
  5. 필요한 경우 다음 항목만 표시 섹션에서 그룹을 선택하고 응용프로그램을 필터링하는 데 사용할 그룹을 선택합니다.
  6. 태그에서는 쿼리를 제한할 태그를 추가합니다. 이 태그와 일치하는 항목만 갤러리 카드에 나타납니다.
  7. 스타일에서는 아이콘 사용 또는 섬네일 사용을 선택하여 갤러리 카드에 사용할 스타일을 지정합니다.
  8. 버튼 텍스트를 변경하여 버튼을 제어합니다. 기본 텍스트는 explore입니다.

바닥글 설정

사이트 편집기의 기본 설정에는 바닥글이 없습니다. 따라서 사이트의 모든 페이지에 걸쳐 영구 바닥글이 나타나는 사용자 정의 바닥글을 생성해야 합니다.

  1. 바닥글 설정에서 사용자 정의를 선택합니다.

    기본 바닥글이 페이지에 나타나며 CSS 상자가 측면 패널에 나타납니다.

  2. 바닥글의 오른쪽 하단에 있는 기어 아이콘을 클릭하여 HTML을 편집합니다.
  3. 기어 아이콘을 다시 클릭하여 변경 내용을 확인합니다.
  4. 측면 패널의 CSS 상자를 수정한 후 변경 사항 적용을 클릭하여 HTML 결과를 확인합니다.
팁:

바닥글 HTML에는 임베드된 JavaScript가 지원되지 않습니다. 스크립트 태그가 무시됩니다.

마크다운 사용

텍스트 위젯에 마크다운을 사용하여 사이트의 텍스트를 사용자 정의합니다.

마크다운 빠른 시트

속성

구문

헤더

# 여기에 레벨 1의 헤더용 텍스트 입력(가장 큼)

## 여기에 레벨 2의 헤더용 텍스트 입력

###### 여기에 레벨 6의 헤더용 텍스트 입력(가장 작음)

기울임꼴

이 문자가 *기울임꼴* 또는 _기울임꼴_입니다.

굵게

이 문자가 **굵게**입니다.

기울임꼴 및 굵게 결함

*기울임꼴 **및** 굵게 결합*

아래 주소와 연결된 링크

http://www.esri.com

참고 사항:

URL 앞에 프로토콜(HTTP 또는 HTTPS) 사용을 잊지 마세요.

표시된 주소와 연결된 링크

[하이퍼링크 텍스트](http://www.esri.com)

참고 사항:

URL 앞에 프로토콜(HTTP 또는 HTTPS) 사용을 잊지 마세요.

글머리 기호

* 글머리 기호 목록의 첫 번째 항목

* 글머리 기호 목록의 두 번째 항목

정렬된 목록

1. 순차적 목록의 첫 번째 항목

1. 순차적 목록의 두 번째 항목

이미지 삽입

<img src="image source URL including HTTP or HTTPS">

참고 사항:

엔터프라이즈 포털에 이미지가 있으면 “/images/my-amazing-image”와 같은상대 URL을 활용할 수도 있습니다.

하이퍼링크를 포함한 이미지 삽입

<a href="link URL including HTTP or HTTPS"><img src="image source URL including HTTP or HTTPS"></a>