Создание веб-карты, обновляющейся в реальном времени

Первым шагом к созданию приложений реального времени является создание веб-карты с необходимыми данными реального времени Городской департамент общественных работ уже собирает в данные реального времени со своего парка снегоуборочных машин с помощью устройств автоматического определения местоположения транспортных средств (AVL). Эти устройства установлены на каждой снегоуборочной машине и передают GPS координаты транспортного средства на приемник в городском офисе. Вы добавите эти данные на веб-карту, присвоив символы и надписав их так, чтобы они четко передавали пользователям важную информацию.

Добавление данных реального времени

Векторные слои реального времени местного правительства периодически обновляются с помощью ArcGIS GeoEvent Server, который соединяет потоки данных реального времени (такие, как те, что поступают с AVL-устройств, расположенных в каждой снегоуборочной машине) для сервисов пространственных объектов, размещенных на ArcGIS Online и ArcGIS Enterprise. Вы добавите каждый из трех векторных слоев реального времени на новую веб-карту.

Примечание:

Это руководство не будет углубляться в подробности того, как создавать сервисы пространственных объектов реального времени, используя GeoEvent Server. Вы можете узнать больше в руководствах, предоставленных в Галерее ArcGIS GeoEvent Server.

  1. Войдите под учётной записью организации ArcGIS.
    Примечание:

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

  2. На ленте щелкните Карта.
    Примечание:

    В зависимости от настроек организации и пользователя при открытии Map Viewer. ArcGIS Online может предложить два вьюера для просмотра, использования и создания карт. Дополнительные сведения о доступных вьюерах карт и возможности их использования см. в этом FAQ.

    В этом руководстве используется Map Viewer Classic.

  3. Если необходимо, щелкните на ленте Открыть в Map Viewer Classic.

    Откроется Map Viewer Classic.

  4. На ленте щелкните Добавить и выберите Поиск слоев.

    Опция Поиск слоев

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

  5. На панели поиска щёлкните стрелку раскрывающегося списка Мои ресурсы и выберите ArcGIS Online.
  6. В текстовом окне Поиск слоев введите Vehicles (Latest). Затем введите owner:Learn_ArcGIS в поисковой строке, чтобы ограничить результаты поиска слоями, принадлежащими учётной записи администратора Learn ArcGIS. Нажмите Enter, чтобы начать поиск.

    Результат поиска для слоя Vehicles (Latest).

    Результат поиска возвратит слой Vehicles (Latest). Этот слой содержит точечные пространственные объекты, которые будут отображать последнее записанное местоположение каждой снегоуборочной машины. Когда снегоуборочные машины изменяют свое местоположение, их AVL-устройства передают GPS-координаты в GeoEvent Server. Как только слой настроен соответствующим образом, в нём будут автоматически обновляться полученные новые координаты.

  7. Для первых двух слоев Vehicles (Latest) щёлкните кнопку Добавить. Приблизьтесь к объектам, расположенным вокруг Солт-лейк-сити в штате Юта.

    Добавить слой Vehicles (Latest)

    Транспортные средства обозначены цветными треугольниками. Оранжевые треугольники отображают снегоуборочные машины (snowplows), а синие – пикапы с навесными снегоочистителями (pickup trucks). У каждой из пяти машин есть соответствующий символ на карте. В настоящее время местоположения символов на карте не обновляются в реальном времени потому, что вы еще не изменили настройки так, чтобы позволить слою делать это. Сначала необходимо добавить на карту остальные слои. Затем необходимо обновить интервал обновления для слоёв.

  8. На панели Поиск измените строку поиска на Vehicles (Past) owner:Learn_ArcGIS и нажмите Enter.
  9. В результатах поиска для Vehicles (Past) для второго результата щелкните кнопку Добавить.

    Добавьте слой Vehicles (Past)

    Транспортные средства обозначены цветными кружками. Как и раньше, оранжевым обозначены снегоуборочные машины, а синим – пикапы. Как и другой слой, в этом слое обновление в реальном времени еще не включено. К тому же большое количество кружков скрывает треугольники, отображающие последнее местоположение каждого транспортного средства. Позже в этом уроке вы измените символы одного из слоёв, чтобы каждый из них был более отчетливый. Однако сначала вам нужно добавить еще один слой.

  10. В панели Поиск найдите и добавьте второй слой Street Plowed Status, принадлежащий Learn_ArcGIS.

    Слой Street Plowed Status

    Этот слой содержит пространственные объекты, представляющие основные улицы в этом районе. Каждая улица обозначена символом в зависимости от того, была ли она только что очищена от снега (зеленый), не была очищена (красный), или она в процессе уборки (желтый). Несмотря на то, что пространственные объекты выглядят как линии, они на самом деле полигональные. Чтобы определить, заехала или выехала снегоуборочная машина на определенную часть улицы, исходная центральная линия улицы была окружена буфером с выбранным расстоянием. Таким образом, даже если снегоуборочная машина расположена не строго по центру улицы, она все равно определяется, как находящаяся на улице. Буферы были добавлены на GeoEvent Server как геозоны или геометрические границы, которые подают отклик, если что-то попадает в их область. В данном случае, улицы обозначаются либо как убранные, не убранные или находящиеся в процессе уборки, в зависимости от того, пересекала ли снегоуборочная машина геозону или в данный момент находится в ней.

  11. На панели Поиск щёлкните кнопку Назад. Если необходимо, щёлкните Содержание, чтобы увидеть только что добавленные на карту слои

    На панели Содержание показаны слои, которые вы добавили к карте.

    Слои на панели Содержание

    Слой Streets Plowed Status плохо видно на текущей базовой карте, поэтому вы измените базовую карту на карту с более темной цветовой схемой.

  12. На ленте нажмите Базовая карта и выберите Темно-серое полотно.

    Тёмно-серое полотно, базовая карта

    Слой Streets Plowed Status теперь отображается на карте более четко.

    Улицы на базовой карте Темно-серое полотно

    Ваши слои были добавлены, но временной компонент каждого из них неактивен. Хотя эти слои были специально подготовлены с помощью GeoEvent Server, чтобы содержать потоки данных реального времени, основанные на AVL-устройствах каждой из снегоуборочных машин, данные не будут обновляться на карте, пока вы не установите интервал обновления. Интервал обновления – это период времени, в течение которого слой на карте обновляется. Когда слой обновляется, он получает самые свежие данные из потоков данных в реальном времени, подключенных к нему через GeoEvent Server. Пока интервал обновления не установлен, слой будет отображать только те данные, которые были актуальны на момент добавления слоя на карту.

  13. На панели Содержание наведите курсор на слой Street Plowed Status и щёлкните кнопку Дополнительные опции.

    Кнопка Дополнительные опции

    Появится меню с дополнительными настройками слоя.

  14. Перейдите к Интервал обновления, поставьте отметку и введите в текстовое окно 0.5.

    Интервал обновления 0,5 секунды

    Минимальный интервал обновления для этого слоя составляет 0,5 минуты, что равно 30 секундам. Слои на вашей карте будут обновляться каждые 30 секунд последними данными с AVL-устройств.

  15. Следуйте тем же инструкциям, чтобы установить Интервал обновления на 0.5 минуты для слоев Vehicles (Past) и Vehicles (Latest).

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

  16. На панели Содержание наведите курсор на слой Vehicles (Latest), наведите курсор на значок изменения порядка слоёв и перетащите слой выше слоя Street Plowed Status.

    Изменить порядок слоев

  17. Перетащите слой Vehicles (Past), чтобы он оказался между слоями Vehicles (Latest) и Street Plowed Status.

    Порядок слоев

Присвоение символов и надписывание данных

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

  1. На панели Содержание наведите курсор на Vehicles (Latest) и щелкните Изменить стиль.

    Кнопка Изменить стиль

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

  2. В разделе Выберите стиль отображения для Типы (уникальные символы) щелкните Параметры.

    Опции стиля отображения

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

  3. Щелкните синий треугольный символ для пикапов.

    Символ пикапов

    Появится окно, показывающее настройки изменения символа. Настройки включают список символов по умолчанию. Текущая категория списка – формы.

  4. Щелкните ниспадающее меню Формы и выберите Стрелки.

    Категории стрелки

  5. Прокрутите вниз список символов стрелок и щёлкните символ с белой треугольной стрелкой, направленной вверх, внутри синего круга.

    Символ синей стрелки

  6. Измените Размер символа на 20 пикселов.

    Размер символа равен 20

  7. Нажмите OK.

    Новый символ автоматически применен на карте.

    Обновлен символ пикапа

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

  8. На панели Изменить стиль щелкните оранжевый треугольный символ снегоуборочных машин.
  9. Прокрутите вниз список символов стрелок и щёлкните белую треугольную стрелку, указывающую вверх, внутри темно-оранжевого круга.

    Символ оранжевой стрелки

  10. Измените Размер символа на 20 и щелкните OK.

    Обновлены оба символа: для пикапа и для снегоуборочной машины.

    Точечные символы обновлены

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

  11. В панели Изменить стиль установите отметку Повернуть символы (градусы).

    Поворот символов

    Появятся настройки поворота символа.

  12. Щелкните ниспадающее меню и выберите heading. Убедитесь, что выбрано Географический.

    Настройки поворота

    Географический означает, что поворот будет происходить по часовой стрелке от 0, а символ будет вращаться по часовой стрелке от своей текущей ориентации. В результате стрелки будут указывать в направлении движения транспортных средств.

  13. В нижней части панели щелкните OK, и щелкните Готово.

    Символы повернуты на карте

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

  14. На панели Ресурсы наведите курсор на слой Vehicles (Latest) Щелкните кнопку Дополнительные опции и воспользуйтесь командой Создать надписи.

    Создание надписей

    Появится панель Надписать объекты и к транспортным средствам добавятся надписи по умолчанию. Транспортные средства надписаны по их номерам (Truck 1, Truck 2 и так далее), которые помогут властям города идентифицировать на карте каждую из машин их автопарка. Однако надписи по умолчанию используют простой черный текст, не заметный на темной базовой карте.

  15. В панели Надписать объекты щелкните на текущий цвет текста надписи и выберите белый.

    Белый цвет текста надписей

    Белый текст лучше видно на карте. Однако по умолчанию надписи расположены в правом верхнем углу символа. Когда машины рядом друг с другом, становится сложно различать, какая надпись к какому символу относится.

  16. Для Выравнивания выберите выравнивание по центру внизу.

    Выравнивание

  17. В нижней части панели щелкните OK.

    Белые надписи

    Готовые надписи четче показывают, какая снегоуборочная машина или пикап к какому символу относится. (Если два символа перекрываются, они могут не отображаться на карте). Далее вы сохраните карту.

Фильтрация прошлых местоположений снегоуборочных машин

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

  1. Для слоя Vehicles (Past) щёлкните кнопку Фильтр.

    Кнопка Фильтр

    Откроется окно Фильтр. Вы используете это окно, чтобы создать запрос для слоя Vehicles (Past), чтобы отображать только пространственные объекты, которые имеют атрибут времени в течение последних двух минут.

  2. На панели Фильтр: Vehicle(Past) постройте следующее выражение:
    • Для Поле выберите time.
    • Для оператора выберите В последние.
    • В Значение укажите 2 минуты.

    Применение фильтра для снегоуборочных машин

    Выражение применит фильтр ко всем типам транспортных средств (как к снегоуборочным машинам, так и к пикапам), которые были обновлены в течение последних двух минут относительно текущего времени.

  3. Щёлкните Применить фильтр, чтобы установить выражение.

    Данные на карте отфильтрованы.

    Карта с применением фильтра

    Теперь каждая снегоуборочная машина отслеживается по пути из точек с предыдущими местоположениями. Фильтр позволяет пользователям лучше понять, где была каждая снегоуборочная машина, и какие улицы были только что убраны.

  4. На ленте щелкните Сохранить и выберите Сохранить как.

    Кнопка Сохранить

  5. В окне Сохранить карту заполните следующее:
    • Для Заголовок введите Snowplows in a Utah City и добавьте свое имя или инициалы.
    • В опции Теги введите Snowplows, Roads, Utah
    • В опции Краткая информация введите This map shows the real-time location of snowplows in a city in Utah.
    Сохранение карты
  6. Щелкните Сохранить карту.

Теперь ваша карта готова. Она показывает местоположение снегоуборочных машин и статус дорог в городе. Слои данных обновляются в реальном времени с интервалом в 30 секунд, а пространственные объекты четко передают важную информацию пользователю.


Создание операционной панели

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

  • Обновляющийся в реальном времени список с названиями транспортных средств, скоростями и временем последнего обновления местоположения
  • Линейчатую диаграмму, обновляемую в реальном времени, со скоростями транспортных средств
  • Обновляемую в реальном времени круговую диаграмму с соотношением статуса очистки от снега
  • Список, показывающий названия улиц и статус очистки от снега

Эта информация поможет местным властям организовать маршруты снегоуборочных машин для более эффективной очистки дорог. Вы создадите подобную панель при помощи ArcGIS Dashboards. Операционные панели полностью настраиваемые и могут включать в себя элементы, показывающие карты, списки и диаграммы. На этом уроке вы установите бесплатный ArcGIS Dashboards и используете его для объединения вашей веб-карты с информацией, запрашиваемой чиновниками городской администрации.

Добавление карты к операционной панели

Для начала вы выберете карту, которая будет использоваться на панели.

  1. При необходимости войдите в свою учетную запись ArcGIS Online.
  2. На Ленте щелкните Главная и выберите Ресурсы.
  3. На ленте щёлкните окно запуска приложений и выберите Dashboards.

    Приложение Dashboards

    Откроется главная страница ArcGIS Dashboards, на которой вы можете создавать, редактировать и просматривать панели.

  4. Щелкните Создать операционную панель.

    Откроется окно Создание новой операционной панели.

  5. В окне Создание новой операционной панели введите следующее:
    • В опции Заголовок введите Snowplows in a Utah City.
    • В разделе Теги введите Learn.
    • В качестве Краткой информации введите The location of snowplows and the status of roads in a city in Utah.
    • В опции Папка выберите местоположение для сохранения своей панели.

    Создание новой операционной панели

  6. Щёлкните Создать операционную панель, чтобы сгенерировать новое приложение панели.

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

    • Карта
    • Список
    • Серийная диаграмма
    • Круговая диаграмма
  7. На боковой панели щелкните кнопку Добавить элемент.

    Кнопка добавить элемент на боковой панели

    Появится панель Компоновка

  8. На операционной панели выберите Карта.

    Добавление карты к операционной панели

    Панель Выбрать карту появится и покажет все карты, которые есть в вашей учётной записи ArcGIS.

  9. Укажите веб-карту Snowplows in a Utah City. Щёлкните Выбрать, чтобы добавить карту как элемент операционной панели.

    Ресурсы веб-карты будут служить источником данных для прочих элементов.

    Выберите карту, чтобы добавить к операционной панели

    Появится окно Карта Snowplows in a Utah City, в котором можно настроить свойства конфигурации карты.

  10. На вкладке Настройки включите следующие опции:
    • Начальный вид и закладки
    • Видимость слоев
    • Переключатель базовой карты
    • Поиск

    Настройка параметров карты

    Эти возможности позволят пользователю лучше ориентироваться на карте и выбирать интересующие объекты.

  11. Щелкните вкладку Действия над слоем.

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

  12. Щелкните Готово.

    Панель появится с только что настроенными элементами карты.

  13. На карте щелкните грузовик, чтобы открыть всплывающее окно с атрибутами объекта.

    Настроенный элемент карты со всплывающей подсказкой

    Поскольку всплывающие окна включены в операционной панели, автоматически включается функциональность доступа к атрибутам по щелчку объекта.

  14. Самостоятельно изучите компоновку и пощелкайте другие объекты, чтобы посмотреть их атрибуты.
  15. Закройте всплывающее окно.

Добавление элементов

Вы настроили свой элемент карты и воспользовались некоторыми возможностями Dashboards по работе с реальным временем, чтобы ваша карта предоставляла информацию более отчетливо. Как было сказано в начале урока, городские власти хотят иметь удобный доступ к некоторой дополнительной информации о снегоуборочных машинах. В частности, их интересует список информации о каждой машине, а также графики, которыми можно пользоваться для сопоставления информации о разных транспортных средствах или улицах. Также они хотят список с названиями улиц и статусом их очистки от снега. Чтобы предоставить эту информацию, вы настроите три элемента и расположите их на карте.

  1. На боковой панели щелкните Добавить элемент.

    Далее вы выберете, куда добавить этот элемент. Вы можете добавить элементы на любую сторону операционной панели или размещать их поверх любых существующих элементов. Ваш следующий элемент будет добавлен на левую боковую операционную панель.

  2. На боковой панели инструментов щелкните кнопку Добавить элемент. На краю операционной панели нажмите знак плюс и выберите Список.

    Добавить элемент списка

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

  3. На панели Выбрать слой выберите Vehicle (Latest).

    Выбрать слой списка

    Панель конфигурации Список изменится, на ней появятся опции отображения данных для слоя Vehicle (Latest).

    Свойства выбора слоя для списка

    Примечание:

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

    По умолчанию машины расположены в соответствии с их ObjectID, полем, которое упорядочивает пространственные объекты в слое. Вы расположите их в списке по порядку названий транспортных средств.

  4. На панели Опции данных для Сортировать по щёлкните Добавить поле, выберите vehiclename.

    Сортировка по полю vehiclename

  5. Щелкните значок сортировки и убедитесь, что выбрано По возрастанию.

    Сортировать список по возрастанию

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

  6. На боковой панели щелкните вкладку Список. Поле vehiclename автоматически добавляется в текстовое окно.

    Добавьте поле vehiclename.

  7. Установите курсор после {field/vehiclename} и нажмите Enter. Нажмите на стрелку ниспадающего меню Вставить и добавьте поле speed.

    Добавление полей списка

    Предварительный просмотр списка теперь содержит скорости для каждого транспортного средства в милях в час – в правой части панели опций списка.

    Дополнительные поля в списке

  8. Перейдите на закладку Действия. Для параметра При изменении выборки щелкните стрелку ниспадающего списка Масштабировать и используйте кнопку-переключатель для включения масштабирования. Это приведет к тому, что карта будет приближена к выбранному грузовику.

    Добавить действие

  9. Перейдите на вкладку Общие и на панели с Общими опциями в качестве Названия и Описания сделайте следующее:
    • Для Заголовка нажмите кнопку Редактировать и введите поле для ввода текста Vehicles.
    • Используйте опции форматирования, чтобы выровнять заголовок по центру и сделать его полужирным.
    • Для Описания щелкните Редактировать и введите на панель текста Speed in miles per hour.

    Опции: общие настройки

    После внесения этих изменений заголовок окажется сверху посередине, а описание – снизу.

  10. Щелкните Готово.

    На панель добавится элемент списка. Вы можете перетащить список и прикрепить его в любом месте.

    Список и карта на панели

  11. Наведите указатель мыши на кнопку списка Параметры и выберите Перетащить элемент. Перетащите элемент списка и прикрепите его справа от элемента карты. Настройте ширину элемента списка так, чтобы он не занимал больше места, чем необходимо.

    Перемещение и конфигурация элемента списка

    Примечание:

    Чтобы настроить ширину элемента, наведите курсор на его границу и перетащите ее до нужного размера.

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

  12. На боковой панели щелкните Добавить элемент. Под элементом списка щелкните Добавить элемент сюда. Выберите Серийная диаграмма.

    Добавление серийной диаграммы.

  13. На панели Выбрать слой выберите Vehicle(Latest).
  14. На панели Опции данных измените следующие параметры:
    • Для Категории из щёлкните Пространственные объекты.
    • Для Поле категории выберите vehiclename.
    • Для Серии щелкните Добавить серию и выберите speed.
    • Для опции Сортировать по щелкните Добавить поле, выберите vehiclename и убедитесь, что выбрано По возрастанию.

    Примечание:

    Если у вас в данных попадётся пустое значение, можно удалить пустую информацию из диаграммы, применив опцию фильтра vehiclename не пусто.

    Элемент диаграммы

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

  15. Щёлкните вкладку Ось категории и в окошке Заголовок введите Vehicle.

    Заголовок горизонтальной оси обновится на Vehicle.

  16. Щёлкните вкладку Ось значения и в окошке Заголовок введите Speed.

    Заголовок вертикальной оси обновится на Speed.

  17. Щелкните вкладку Серии, пролистайте вниз до Цвета столбца и щелкните текущий цветовой образец.
  18. Замените текущий шестизначный код на 00c5ff.

    Изменение цветового кода.

  19. Щёлкните вкладку Общие и на панели общих настроек сделайте следующее:
    • Для Заголовка нажмите кнопку Редактировать и введите Vehicle Speed. Для текста заголовка примените выравнивание по центру.
    • Над полем для ввода текста щёлкните Параграф и выберите Заголовок 2.

    Изменение стиля заголовка.

  20. Щелкните Готово.

    Диаграмма появится под элементом списка.

  21. Измените размер элементов так, чтобы вся информация отображалась понятно.

    Карта, диаграмма и список

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

  22. На боковой панели щелкните Добавить элемент. Под серийной диаграммой щелкните Добавить элемент сюда. Выберите Круговую диаграмму.
  23. На панели Выбрать слой выберите Street Plowed Status.

    Чтобы отобразить процент очищенных улиц, вы покажете количество пространственных объектов, которые могут иметь статус очистки от снега.

  24. На панели Опции данных измените следующие параметры:

    • Для Категории из убедитесь, что выбрано Сгруппированные значения.
    • Для Поле категории выберите PlowedStatus.

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

    Настройки круговой диаграммы

    Примечание:

    Ваши значения могут отличаться, поскольку данные динамические

  25. Щёлкните вкладку Диаграмма.
  26. В окне Опции диаграммы задайте следующее:
    • Разверните секцию Надписи. Для Видимости щёлкните Скрыть.
    • Разверните секцию Легенда. Для Видимости щёлкните Процент.

    Настройки подписей и легенды круговой диаграммы

  27. Щелкните закладку Сектора. На вкладке Сектора щёлкните Применить цвета и выберите цвета на свой вкус либо примите предложенные по умолчанию.
  28. Перейдите на вкладку Общие. Для Заголовка нажмите кнопку Редактировать и введите Streets Plowed Status (Percent).

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

  29. Перейдите на закладку Действия.
  30. На панели Действия в разделе При изменении выборки разверните Фильтр. В ниспадающем списке с помощью переключателя включите Street Plowed Status.
  31. Щелкните Готово.
  32. Измените размер элементов круговой диаграммы, списка и гистограммы для того, чтобы информация отображалась понятно.

    Операционная панель с круговой диаграммой

  33. Чтобы использовать действия объектов, которые вы включили, щёлкните один из сегментов круговой диаграммы и обратите внимание, как слой карты фильтрует улицы на основе вашей выборки.

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

  34. На боковой панели щелкните Добавить элемент и добавьте элемент Список.
  35. На панели Выбрать слой выберите Street Plowed Status.

    Вы хотите, чтобы список показывал статус очистки улицы, поэтому соответственно измените настройки списка. Также вы увеличите максимальное количество объектов, отображаемых в списке, чтобы показывать много улиц одновременно.

  36. На панели Опции данных измените следующие параметры:

    • Для Отображено максимальное число объектов установите значение на 50.
    • Для Сортировать по щелкните Добавить поле, выберите PlowedStatus и убедитесь, что выбрано По возрастанию.

    В предпросмотре появится список улиц, каждая с символом, показывающим статус очистки от снега.

    Настройка опций списка

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

  37. Щёлкните вкладку Список.
  38. На панели Опции списка щелкните после {field/StreetName} и нажмите Enter. В строке ниже {fieldStreetName} добавьте поле PlowedStatus.

    Поля списка статуса очистки снега

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

  39. Перейдите на закладку Действия.
  40. На панели Действия разверните Масштабирование. Переключите карту Snowplows in a Utah City, чтобы ее активировать.
  41. Перейдите на вкладку Общие.
  42. На панели Общие опции для заголовка щелкните Редактировать. Введите Streets Plowed Status (Street Name).
  43. Щелкните Готово.
  44. Измените размер элементов, чтобы минимизировать пустое пространство.

    Панель со списком статуса очистки снега

    Потратьте несколько минут на исследование сконфигурированной операционной панели. Теперь добавьте к ней заголовок.

  45. На боковой панели щелкните кнопку Добавить элемент. Щелкните знак плюс в верхней части карты и выберите Заголовок.
    Добавить заголовок

    По умолчанию заголовок совпадает с названием карты.

  46. Щелкните Готово.

Сохранение панели и предоставление общего доступа

Ваша панель готова, необходимые элементы настроены. Далее вы опубликуете панель для соответствующих людей.

  1. На панели инструментов операционной панели щелкните кнопку Сохранить и выберите Сохранить.
    Сохранение операционной панели
  2. Щелкните значок рядом с названием операционной панели. Из списка выберите Подробная информация об элементе Операционная панель.

    Обновите информацию об элементе панели

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

  3. На вкладке Обзор Snowplows in a Utah City щёлкните Общий доступ.

    Опубликуйте панель в пределах своей организации..

  4. В окне Опубликовать выберите Организация и щелкните Сохранить.

    Когда вы публикуете операционную панель, все связанные с ней карты и наборы данных должны быть доступны таким же образом. Вы можете получить доступ к опубликованной операционной панели через приложение ArcGIS Dashboards или через учетную запись ArcGIS Online.

Вы использовали свою веб-карту для создания операционной панели, которую городские власти могут использовать для эффективного отслеживания и управления снегоочистительными работами. В частности, вы добавили диаграммы, показывающие улицы и транспортные средства.


Создание веб-приложения

Ранее вы создали информационную панель по заказу городской администрации, помогающую оперативно решать вопросы об автопарке снегоуборочных машин во время зимних снегопадов. Теперь вы создадите веб-приложение, предназначенное для общественного пользования. Во время метели необходимо держать население информированным для поддержания безопасности и обеспечения максимальной эффективности перемещений. Однако обычным гражданам не нужен доступ к информации, добавленной на панель, такой как график хода работ или список скоростей транспортных средств. Зато им необходимо знать о текущем состоянии уборки улиц, и когда конкретно на их улице и соединенных с ней улицах будет работать снегоуборочная техника. Вы создадите веб-приложение при помощи ArcGIS Web AppBuilder, чтобы предоставить горожанам доступ к наиболее актуальной информации о ходе снегоуборочных работ.

Добавление потоковых данных на веб-карту

Прежде чем создать веб-приложение, вы добавите на свою веб-карту разные типы ГИС слоев в реальном времени, названных потоковыми сервисами. Потоковые сервисы создаются и публикуются в GeoEvent Server. Однако в отличии от других данных в реальном времени, потоковые сервисы не имеют интервала обновления – новые события добавляются на карту, как только приходят. Используя потоковые сервисы местоположения снегоуборочных машин, ваша веб-карта будет содержать наиболее актуальную информацию, без отсрочек из-за шестисекундного интервала обновления.

  1. Если необходимо, выполните вход под учётной записью организации ArcGIS и откройте свою веб-карту Snowplows in a Utah City.

    Текущая карта используется операционной панелью, поэтому любые внесенные в нее изменения отразятся в панели. Чтобы предотвратить изменения в операционной панели, вы сохраните копию своей карты.

  2. На ленте щелкните Сохранить и выберите Сохранить как.
  3. В окне Сохранить карту измените имя карты на Snowplows in a Utah City (Stream Service). Оставьте все другие параметры без изменений и щелкните Сохранить карту.

    Карта сохранится с новым названием. Изменения, внесенные в эту карту, не повлияют на операционную панель. Далее вы добавите потоковый сервис. Потоковые сервисы размещаются не на ArcGIS Online, поэтому вы не можете искать их среди других слоев ArcGIS Online. Вместо этого вы используете URL сервиса, который ведет к сервису, расположенному на городском ГИС-сервере.

  4. Щелкните на ленте Добавить и выберите Добавить слой из интернета.

    Добавить слой из Интернета

    Откроется окно Добавить слой из Интернета.

  5. Для URL скопируйте и вставьте следующий URL: https://realtimegis2016.esri.com:6443/arcgis/rest/services/SandyVehicles/StreamServer .

    URL для сервиса

  6. Щелкните Добавить слой.

    Новый слой, под названием SandyVehicles, добавлен на карту. Новый слой может быть сложно увидеть из-за других данных, находящихся на карте, поэтому вы выключите некоторые другие слои.

  7. В панели Ресурсы отключите слои Vehicles (Latest) и Vehicles (Past).

    Транспортные средства
    Примечание:

    Ваши точки могут отличаться.

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

  8. Выберите на панели Содержание слой SandyVehicles, щелкните кнопку Еще опции, а затем нажмите Переименовать.

    Переименовать

  9. Измените имя слоя на Vehicles (Stream) и щёлкните OK.

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

Присвоение символов слою потоковых данных

Далее вы измените символы по умолчанию потокового сервиса, чтобы сделать похожими на символы слоя Vehicles (Latest). Также вы измените символ сервиса, чтобы показывать след, оставленный транспортным средством в недавнем прошлом.

  1. На панели Содержание наведите курсор на слой Vehicles (Stream) и щелкните кнопку Изменить стиль.

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

  2. На панели Изменить стиль щелкните Символы.

    Символы

    Появится окно с настройками символов.

  3. На вкладке Форма измените при необходимости категорию символов на Стрелки. Прокрутите вниз список символов стрелок, пока не найдете треугольник, указывающий вверх, в фиолетовом круге.

    Символ фиолетовая стрелка

  4. Измените Размер символа на 20 px (пикселов) и щелкните OK.

    Новый символ добавлен на карту.

    Символ для транспортных средств

  5. В панели Изменить стиль установите отметку Повернуть символы (градусы). В ниспадающем меню выберите heading и убедитесь, что выбрано Географический.

    Теперь у вас будет символ, включающий дополнительные 10 местоположений каждого транспортного средства. Таким образом за каждым символом будет оставаться след из последних известных местоположений транспортного средства, как и в операционной панели. Хотя в операционной панели вы добились этого эффекта использовав фильтр, в своей веб-карте вы сделаете его с помощью символов слоя.

  6. В разделе Потоковая передача этого слоя обновила наблюдения объектов отметьте Отобразить предыдущие 5 наблюдений и измените количество наблюдений на 10.

    Отобразить предыдущие наблюдения

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

    Предыдущие наблюдения транспортных средств

    Синие кружки — это символ по умолчанию. Вы измените его, чтобы он был больше похож на символ фиолетовой стрелки.

  7. На панели Изменить стиль, под предыдущими наблюдениями, для Символ щелкните символ синего кружка.

    Символ предыдущих наблюдений

    Появится окно с настройками символов.

  8. Если необходимо, измените категорию символов на Стрелки. Прокрутите вниз, пока не найдете фиолетовую треугольную стрелку, указывающую вверх.

    Фиолетовая стрелка для предыдущих наблюдений

  9. Измените Размер символа на 12 px (пикселов) и щелкните OK.

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

    Предыдущие наблюдения

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

  10. На панели Изменить стиль отметьте опцию Соединить наблюдения, для Символ щелкните черную линию. В перечне цветов щелкните патч белого цвета и щелкните OK.
  11. В нижней части панели Изменить стиль щёлкните OK.
  12. Увеличьте изображение, пока отчетливо не увидите линию, соединяющую наблюдения.

    Окончательный символ для транспортного средства

  13. Когда вы закончите проверять линию, вернитесь к полному экстенту данных.
  14. На ленте щелкните кнопку Сохранить.

Создание веб-приложения

Теперь, когда вы добавили на карту потоковые сервисы, отображающие данные в реальном времени еще быстрее, вы создадите веб-приложение, используя Web AppBuilder. Веб-приложения – это веб-карты с пользовательским интерфейсом, адаптированным для конкретных целей. Это позволит добавить описательную информацию или ссылки на вашу организацию. В частности, Web AppBuilder предоставляет полный спектр настраиваемых опций при создании веб-приложения, в отличие от шаблонов веб-приложений, доступных в ArcGIS Online. Первым шагом к созданию веб-приложения будет обеспечение общего доступа к вашей карте.

  1. На ленте щелкните Общий доступ.

    Кнопка Поделиться

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

  2. В окне Общий доступ отметьте Для всех (общий).

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

  3. Щелкните Создать веб-приложение.

    Кнопка Создать веб-приложение

    Откроется окно Создание нового веб приложения. Это окно содержит список настраиваемых шаблонов приложений. Вместо этого вы создадите пользовательское веб-приложение при помощи Web AppBuilder.

  4. Щелкните на вкладке Web AppBuilder.

    Вкладка Web AppBuilder

    Эта вкладка предоставляет опции для названия веб-приложения, тегов и другой информации. Некоторые параметры заполнены информацией из веб-карты, но вы измените название и краткую информацию.

  5. В качестве Заголовка введите Веб-приложение для работ по уборке снега.
  6. В качестве Краткой информации введите Web application for viewing the current status of snow removal operations in a city in Utah.
  7. Убедитесь, что Опубликуйте это приложение тем же способом, что и карту отмечено и щелкните Начать.

    Запустится Web AppBuilder.

Настройка веб-приложения

Web AppBuilder в данный момент содержит веб-карту, название по умолчанию и несколько функций карты по умолчанию. Далее вы настроите аспекты внешнего вида и функционала веб-приложения. В частности, добавите в веб-приложение виджет, предоставляющий повышенный контроль над потоковыми сервисами.

  1. В левой панели Web AppBuilder на вкладке Тема выберите Тема дротика.

    Темная тема

    Эта тема размещает название веб-приложения и многие элементы управления на серой полоске внизу экрана, называемой контроллером. Это упрощает некоторые функциональные возможности и предоставляет больше внимания карте. Однако серый контролер не выделяется на фоне темной базовой карты, поэтому вы измените его цвет.

  2. Для Стиля, выберите фиолетовую цветовую схему.

    Фиолетовая цветовая схема

    Эта цветовая схема совпадает с фиолетовыми символами транспортных средств на карте. Это приводит к тому, что информация контроллера и инструменты выделяются, а также подчеркивают наиболее важные данные в реальном времени. Далее вы измените некоторые другие аспекты своей веб-карты. На левой панели есть четыре вкладки: Тема, Карта, Виджет и Атрибут. Вкладка Карта позволяет вам выбрать карту, которую вы хотите использовать в своем веб-приложении и изменить ее экстент по умолчанию. Вы уже выбрали карту, поэтому эта вкладка не нужна. Вкладка Атрибут позволяет изменить название приложения так же, как и некоторую другую информацию. Вы уже дали приложению название, поэтому не будете использовать эту вкладку.

  3. Щелкните вкладку Виджет.

    Вкладка Виджет

    Когда вы создавали операционную панель, вы тоже добавляли виджеты. Это были виджеты со списками и диаграммами, содержащими более подробную информацию об операциях. Вы также можете добавить виджеты к веб-приложению, создаваемому вами в Web AppBuilder. Эти виджеты помогают пользователю выполнять множество картографических задач, таких как навигация и измерения. Вы добавите виджет, позволяющий пользователям взаимодействовать с потоковым слоем в приложении.

  4. На вкладке Виджет щелкните Настроить виджеты в этом контроллере.

    На данный момент в контроллере есть три виджета: легенда, список слоев и бегунок масштаба. Эти виджеты отображаются в виде кнопок в контроллере под названием.

    Подсказка:

    Чтобы убрать виджет, наведите на него в левой панели курсор и щёлкните кнопку Удалить.

  5. В списке виджетов щёлкните кнопку добавления виджета.

    Кнопка добавления виджетов

    Появится окно Выбор виджет. Это окно содержит все возможные типы виджетов, которые вы можете добавить в контроллер. Вы можете настроить более 50 виджетов.

  6. В окне Выбор виджета выберите виджет Потоковый сервис и щелкните OK.

    Виджет Потоковый сервис

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

  7. Оставьте настройки по умолчанию и щёлкните OK.

    Виджет добавлен на контроллер.

  8. Рядом с нижней частью странице на контролере щелкните виджет Потоковый сервис.

    Потоковый сервис на контроллере

    На карте появится окно Потоковый сервис.

    Элементы управления потокового слоя

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

  9. Когда закончите, закройте окно.

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

    Примечание:

    Для получения более подробной информации о Web AppBuilder и некоторых доступных виджетах, попробуйте урок Learn ArcGIS Оползень в штате Вашингтон – до и после.

  10. В нижней части панели слева нажмите Сохранить. После того, как приложение сохранится, щелкните Запустить, чтобы открыть его.

    Готовое приложение откроется в новой вкладке браузера или окне.

    Готовое веб-приложение

  11. Изучите готовое приложение.

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

  12. Когда закончите изучать, закройте приложение и вернитесь в Web AppBuilder.

    Теперь вам надо проверить метаданные приложения.

  13. Вверху Web AppBuilder щелкните название приложения.

    Откроется страница с подробной информацией о приложении. Страница содержит Название, описание и ограничения на использование приложение, а также другую информацию. Вы также можете добавить эскиз. Рекомендуется использовать как можно больше метаданных, особенно для приложения, предназначенного для публичного пользования. В городской администрации скорее всего захотят отредактировать метаданные, чтобы добавить в них ссылки и связи с городским сайтом. Также они могут добавить изображение печати или баннера города в качестве эскиза, чтобы ясно показать, что приложение официальное. Однако для целей этого урока вы можете редактировать метаданные как вам нравится.

  14. Добавьте обзорное изображение и описание.

    Ваше приложение уже выложено в общий доступ, поэтому кто угодно, у кого есть URL приложения, может просматривать его. Чтобы распространить его, предоставьте городской администрации URL, чтобы они могли скопировать и выложить его на официальных страницах.

  15. Прокрутите в нижнюю часть страницы описания элемента. Под URL, скопируйте URL приложения и поделитесь им со всеми, с кем захотите. Также можно опубликовать URL через социальные сети, чтобы увеличить охват аудитории.

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

Вы можете найти больше учебных пособий в галерее учебных пособий.