Вставка диаграмм, таблиц и показателей

Создание визуализаций данных с использованием диаграмм, таблиц и суммарной статистики. Эти типы визуализаций применяются для отображения ключевых статистических данных и тенденций. Участники основной команды могут создавать визуализации данных, используя частные и общедоступные наборы данных. Только пользователи, для которых опубликованы данные, могут просматривать диаграмму или статистику после входа на сайт или страницу.

Для начала работы войдите в Portal for ArcGIS и щелкните Сайты на странице Обзор, чтобы увидеть список своих сайтов.

Подсказка:

Вы также можете редактировать сайт при просмотре в браузере. Убедитесь, что вы вошли в систему и найдите кнопку редактирования слева от вашего сайта.

Создать таблицу

Используйте карточку Текст, чтобы организовать информацию в таблице.

Подсказка:

Если вы хотите создать таблицу с использованием HTML, используйте вид Код в параметрах текстовой карточки, чтобы вставить код.

1. Перетащите карточку Баннер в имеющуюся строку.
2. Наведите курсор на карточку и щелкните кнопку настроек, чтобы перейти в режим редактирования.
3. Нажмите опцию таблицы.
4. Выберите число ячеек, необходимых для столбцов и строк.
5. После определения размера вашей таблицы, щелкните, чтобы добавить её. Добавьте или удалите строки или столбцы, щелкая внутри ячейки и нажимая кнопки вставки или удаления строк или столбцов. Щелкните кнопку удаления, чтобы удалить таблицу полностью.

   Подсказка:

   Чтобы добавить заголовок, щелкните верхнюю строку вашей таблицы и нажмите кнопку Переключить заголовок таблицы. Заголовки упрощают работу с содержимым таблицы тем, кто использует вспомогательные методы для работы с таблицами.

6. Щелкните Сохранить.

Показать ключевые показатели

Используйте карточку Суммарная статистика для отображения ключевых индикаторов производительности и др. Суммарная статистика генерируется из запроса к набору данных и автоматически обновляется по мере обновления набора данных. Только пользователи, для которых опубликована суммарная статистика, могут просматривать ее.

1. Перетащите карточку Суммарная статистика в существующую строку.
2. Наведите курсор на карточку и щелкните кнопку настроек, чтобы перейти в режим редактирования.
3. Щелкните Добавить данные и выберите набор данных. При изменении сайта ссылка на источник под статистикой будет вести на страницу деталей элемента для страницы предпросмотра набора данных.
4. Для Поле статистики, укажите поле из выбранного набора данных.
5. Для Тип статистики, выберите тип операции, которая будет выполняться на выбранном поле.
   • Для текстовых полей и полей дат выберите между количеством, минимумом и максимумом.
   • Для числовых полей выберите между количеством, суммой, минимумом, максимумом, средним отклонением и дисперсией.
6. Дополнительно добавьте фильтр к вашей статистике, выбрав атрибут из ниспадающего меню Выбрать атрибут.
   1. Выберите атрибут, используемый как фильтр.
   2. Щёлкните Добавить.
   3. Выберите новое атрибутивное поле, чтобы показать ввод фильтра. Входное поле может отличаться, в зависимости от типа поля.
   4. Введите подходящий фильтр.
   5. Щелкните за пределами поля фильтра или нажмите Enter.
7. Введите заголовок в текстовом окне Заголовок.
8. Дополнительно введите текст в поле Завершающий текст, чтобы ввести ссылку на набор данных статистики, и измените Цвет акцентов для текста.

   Подсказка:

   Если вы выбрали отображение завершающего текста, убедитесь, что цвет текста контрастирует с фоновым цветом строки.

9. Настройте параметр Время ожидания на подключение к серверу (секунды) на более высокое значение (для больших сервисов), чтобы предоставить службе больше времени на ответ.
10. Щелкните Сохранить.

Настройка статического отображения

Вы можете настроить оформление метрик, используя карточку Суммарная статистика.

1. После настройки карточки Суммарная статистика, щелкните меню Внешний вид в разделе Настройки статистики на боковой панели.
2. Дополнительно выберите вставку Заголовка статистики. Вы можете использовать эту опцию для точного обозначения статистических параметров.
3. Добавьте текст в поле Завершающий текст, чтобы представить дополнительные сведения о статистике, такие как подробные сведения об источнике и настройках.
4. Настройка Акцентный цвет приводит только к изменению цвета метрики. Выберите цвет, который контрастирует с фоновым цветом строки.

Линейные диаграммы

Используйте карточку Диаграмма и создайте столбчатую диаграмму для суммирования и сравнения категорийных данных.

1. Перетащите карточку Диаграмма в существующую строку.
2. Наведите курсор на карточку и щелкните кнопку настроек, чтобы перейти в режим редактирования.
3. Линейчатая диаграмма является выбором по умолчанию.
4. Щелкните Добавить данные.
5. Выберите элемент в доступных сервисах данных.
6. Для Выбрать атрибут категории выберите в данных первичный элемент диаграммы.

   В диаграммах могут использоваться числовые и строковые поля. По умолчанию при выборе атрибута категории итоговая диаграмма будет учитывать этот атрибут.

7. Дополнительно Выберите атрибут значений, чтобы выбрать числовое поле, которое будет служить метрикой значений для атрибута категории. Когда выбор будет сделан, статистической операцией в этом поле будет сумма. Вы можете изменить настройки Статистической операции, используя ниспадающее меню справа от переключателя Выбрать атрибут значений. Атрибут значений поддерживает значения Мин., Макс., Сумма, Среднее и Число. Когда выбрано Число, атрибут значения отменяется (потому что нет необходимости в дополнительном поле для указания атрибута категории).

   В диаграммах могут использоваться числовые и строковые поля. По умолчанию при выборе атрибута категории итоговая диаграмма будет учитывать этот атрибут.

8. Нажмите меню Опции, чтобы настроить отображении диаграммы с помощью следующих настроек:
   • Опция Сортировка позволяет выбрать, какие атрибутивные данные будут показаны. Выберите атрибут и , затем щелкните на кнопку сортировки рядом с атрибутом, чтобы показать данные по возрастанию или убыванию.
   • Задайте значение высоты (в пикселах) для диаграммы в текстовом поле Высота (пикс).
   • Чтобы показать заголовок диаграммы, щелкните кнопку переключателя Заголовок диаграммы. При показе заголовка введите его имя в текстовом поле и выберите способ выравнивания.
   • Настройте Основной цвет диаграммы, указав цветовой код , или выбрав его на палитре.
   • Введите текст для полей Подпись категории и Подпись значения.
9. Настройте параметр Время ожидания на подключение к серверу (секунды) на более высокое значение (для больших сервисов), чтобы предоставить службе больше времени на ответ.
10. Щелкните Сохранить.

Круговые диаграммы

Используйте карточку Диаграмма и создайте круговую диаграмму для иллюстрации, как отдельные части связаны со всем набором. Используйте круговую диаграмму, когда в данных есть только несколько категорий.

1. Перетащите карточку Диаграмма в существующую строку.
2. Наведите курсор на карточку и щелкните кнопку настроек, чтобы перейти в режим редактирования.
3. Выберите круговую диаграмму, щелкнув соответствующую кнопку.
4. Щелкните Добавить данные.
5. Выберите элемент в доступных сервисах данных.
6. Для Выбрать атрибут категории выберите в данных первичный элемент диаграммы.

   В диаграммах могут использоваться числовые и строковые поля. По умолчанию при выборе атрибута категории итоговая диаграмма будет учитывать этот атрибут.

7. Дополнительно Выберите атрибут значений, чтобы выбрать числовое поле, которое будет служить метрикой значений для атрибута категории. Когда выбор будет сделан, статистической операцией в этом поле будет сумма. Вы можете изменить Статистическую операцию, используя ниспадающий список справа от переключателя Выбрать атрибут значений. Атрибут значений поддерживает значения Мин., Макс., Сумма, Среднее и Число. Когда выбрано Число, атрибут значения отменяется (потому что нет необходимости в дополнительном поле для указания атрибута категории).

   В диаграммах могут использоваться числовые и строковые поля. По умолчанию при выборе атрибута категории итоговая диаграмма будет учитывать этот атрибут.

8. Нажмите меню Опции, чтобы настроить отображении диаграммы с помощью следующих настроек:
   • Опция Сортировка позволяет выбрать, какие атрибутивные данные будут показаны. Выберите атрибут и , затем щелкните на кнопку сортировки рядом с атрибутом, чтобы показать данные по возрастанию или убыванию.
   • Задайте значение высоты (в пикселах) для диаграммы в текстовом поле Высота (пикс).
   • Чтобы показать заголовок диаграммы, щелкните кнопку переключателя Заголовок диаграммы. При показе заголовка введите его имя в текстовом поле и выберите способ выравнивания.
   • Настройте текст Подписи категории для надписывания каждого сектора в виде подсказки и текст Подписи значения для надписывания единиц изменения в подсказке.
9. Настройте параметр Время ожидания на подключение к серверу (секунды) на более высокое значение (для больших сервисов), чтобы предоставить службе больше времени на ответ.
10. Щелкните Сохранить.

Диаграммы-графики

Используйте карточку Диаграмма и создайте диаграмма-график для визуализации изменений в непрерывном диапазоне, например времени или расстояния.

1. Перетащите карточку Диаграмма в существующую строку.
2. Наведите курсор на карточку и щелкните кнопку настроек, чтобы перейти в режим редактирования.
3. Выберите диаграмму-график, щелкнув соответствующую кнопку.
4. Щелкните Добавить данные.
5. Выберите элемент в доступных сервисах данных.
6. Для Выбрать атрибут категории выберите в данных первичный элемент диаграммы.

   В диаграммах могут использоваться числовые и строковые поля. По умолчанию при выборе атрибута категории итоговая диаграмма будет учитывать этот атрибут.

7. Дополнительно Выберите атрибут значений, чтобы выбрать числовое поле, которое будет служить метрикой значений для атрибута категории. Когда выбор будет сделан, статистической операцией в этом поле будет сумма. Вы можете изменить Статистическую операцию, используя ниспадающий список справа от переключателя Выбрать атрибут значений. Атрибут значений поддерживает значения Мин., Макс., Сумма, Среднее и Число. Когда выбрано Число, атрибут значения отменяется (потому что нет необходимости в дополнительном поле для указания атрибута категории).

   В диаграммах могут использоваться числовые и строковые поля. По умолчанию при выборе атрибута категории итоговая диаграмма будет учитывать этот атрибут.

8. Нажмите меню Опции, чтобы настроить отображении диаграммы с помощью следующих настроек:
   • Опция Сортировка позволяет выбрать, какие атрибутивные данные будут показаны. Выберите атрибут и , затем щелкните на кнопку сортировки рядом с атрибутом, чтобы показать данные по возрастанию или убыванию.
   • Задайте значение высоты (в пикселах) для диаграммы в текстовом поле Высота (пикс).
   • Чтобы показать заголовок диаграммы, щелкните кнопку переключателя Заголовок диаграммы. При показе заголовка введите его имя в текстовом поле и выберите способ выравнивания.
   • Настройте Основной цвет диаграммы, указав цветовой код , или выбрав его на палитре.
   • Настройте текст Подписи категории для надписывания каждого точки в виде подсказки и текст Подписи значения для надписывания единиц метрики в подсказке.
9. Настройте параметр Время ожидания на подключение к серверу (секунды) на более высокое значение (для больших сервисов), чтобы предоставить службе больше времени на ответ.
10. Щелкните Сохранить.

Диаграммы рассеивания

Используйте карточку Диаграмма и создайте диаграмму рассеивания, чтобы показать взаимосвязь между двумя числовыми переменными. Отобразите одну переменную на оси X, а другую переменную на оси Y.

1. Перетащите карточку Диаграмма в существующую строку.
2. Наведите курсор на карточку и щелкните кнопку настроек, чтобы перейти в режим редактирования.
3. Выберите диаграмму-график, щелкнув соответствующую кнопку.
4. Щелкните Добавить данные.
5. Выберите элемент в доступных сервисах данных.
6. Нажмите Выбрать атрибут оси Х, чтобы выбрать из данных первичный элемент диаграммы.

   В диаграммах могут использоваться числовые и строковые поля. По умолчанию при выборе атрибута категории итоговая диаграмма будет учитывать этот атрибут.

7. Выберите атрибут для поля Выберите атрибут оси Y. Выберите числовое поле, которое будет служить метрикой значений для атрибута категории.

   В диаграммах могут использоваться числовые и строковые поля. По умолчанию при выборе атрибута категории итоговая диаграмма будет учитывать этот атрибут.

8. Нажмите меню Опции, чтобы настроить отображении диаграммы с помощью следующих настроек:
   • Опция Сортировка позволяет выбрать, какие атрибутивные данные будут показаны. Выберите атрибут и , затем щелкните на кнопку сортировки рядом с атрибутом, чтобы показать данные по возрастанию или убыванию.
   • Задайте значение высоты (в пикселах) для диаграммы в текстовом поле Высота (пикс).
   • Чтобы показать заголовок диаграммы, щелкните кнопку переключателя Заголовок диаграммы. При показе заголовка введите его имя в текстовом поле и выберите способ выравнивания.
   • Настройте Основной цвет диаграммы, указав цветовой код, или выбрав его на палитре.
   • Настройте подписи для Подпись оси X и Подпись оси Y, чтобы они показывались в диаграмме.
9. Настройте параметр Время ожидания на подключение к серверу (секунды) на более высокое значение (для больших сервисов), чтобы предоставить службе больше времени на ответ.
10. Щелкните Сохранить.

Диаграммы JSON

Используйте карточку Диаграмма и создайте пользовательскую диаграмму с помощью JSON, используя определенную спецификацию диаграммы.

1. Перетащите карточку Диаграмма в существующую строку.
2. Наведите курсор на карточку и щелкните кнопку настроек, чтобы перейти в режим редактирования.
3. Выберите заголовок JSON.
4. Введите JSON в поле Спецификация диаграммы JSON.
5. Дополнительно, в разделе Опции можно включить/отключить или настроить Заголовок диаграммы и Высоту (в пикселах).
6. Настройте параметр Время ожидания на подключение к серверу (секунды) на более высокое значение (для больших сервисов), чтобы предоставить службе больше времени на ответ.
7. Щелкните Сохранить.

Наборы данных

Массив наборов данных задает URL-адрес сервиса объектов ArcGIS и параметры запроса. Обратитесь к документации 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": "scatter",
  "datasets": [ {
    "url": "https://services1.arcgis.com/bqfNVPUK3HOnCFmA/arcgis/rest/services/Demographics_(Median_Household_Income)/FeatureServer/0"
  }],
  "series": [
    {
      "category": {"field": "TotalPop2015", "label": "Population"},
      "value": {"field": "MedianHHIncome2015", "label": "Median Median Household Income"}
    }
  ]
}

Пример пузырьковой диаграммы рассеяния

{
  "type": "scatter",
  "datasets": [
    {
      "url":"https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0"
    }
  ],
  "series": [
    {
        "category": {"field": "Number_of", "label": "Number of Teachers"},
        "value": {"field": "F_of_teach", "label": "Fraction of Teachers"},
        "size": {"field": "Not_Taught", "label": "Number not Taught"}
      }
  ]
}

Пример диаграммы временной шкалы

Примечание:

Категорией должно быть поле datetime.

 {
  "type": "timeline",
  "datasets": [
    {
      "url": "https://services.arcgis.com/bkrWlSKcjUDFDtgw/arcgis/rest/services/DC_Crashes/FeatureServer/0",
      "query": {
        "where": "REPORTDATE > '2008-10-01' AND REPORTDATE < '2008-11-01'",
        "orderByFields": "REPORTDATE ASC",
        "sqlFormat": "standard"
      }
    }
  ],
  "series": [
    {
      "category": {
        "field": "REPORTDATE",
        "label": "Date"
      },
      "value": {
        "field": "MAJORINJURIES",
        "label": "Major Injuries"
      }
    }
  ]
}