Skip to main content

Расширенное встраивание

Бета-версия:

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

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

Расширенное встраивание доступно для историй, брифингов и коллекций.

Веб-разработчики могут использовать расширенное встраивание для интеграции элемента ArcGIS StoryMaps в ваш веб-сайт и его публикации с пользовательской ссылкой на вашем веб-домене, например, https://www.my-organization.gov/annual-report. Оно также позволяет изменять внешний вид элемента ArcGIS StoryMaps и добавлять пользовательскую функциональность с применением HTML, CSS и JavaScript.

Расширенное встраивание осуществляется с помощью тегов <script>, которые позволяют рассматривать ресурсы элемента ArcGIS StoryMaps как часть веб-страницы хоста. Это обеспечивает больший контроль над оформлением ресурсов и устраняет дополнительные полосы прокрутки, которые могут возникать при использовании стандартного встраивания с помощью <iframe>. Код приложения ArcGIS StoryMaps хранится на серверах Esri и автоматически обновляется, чтобы предоставить вам лучшие и новейшие улучшения в области безопасности и производительности.

С помощью расширенного встраивания можно сделать следующее:

  • Встроить элемент ArcGIS StoryMaps в конкретный URL на вашем веб-домене

  • Интегрировать элемент ArcGIS StoryMaps в глобальную навигацию вашего веб-сайта, используя стандартные верхний и нижний колонтитулы веб-сайта вашей организации

  • Избежать использования нескольких полос прокрутки при встраивании ресурсов ArcGIS StoryMaps на свой веб-сайт

  • Использовать собственные шрифты

  • Применять пользовательские стили к изображениям, гиперссылкам, кнопкам и другим элементам ресурсов

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

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

  • Отслеживать вовлеченность читателей с помощью предпочитаемого аналитического сервиса

Подсказка:

Для получения дополнительной информации и примеров см. примеры разработки ArcGIS StoryMaps на GitHub.

Включение расширенного встраивания

Выполните следующие шаги, чтобы включить расширенное встраивание:

  1. В конструкторе щелкните кнопку Больше ⋯ в заголовке и выберите Настройки.

  2. На вкладке Расширенное щелкните Включить расширенное встраивание.

  3. В разделе Разрешенные домены введите имя домена, куда планируете встроить элемент ArcGIS StoryMaps; например www.example.com. Не указывайте номер протокола или порта.

  4. Щёлкните Добавить.

  5. Повторите шаги, чтобы добавить дополнительные домены, если необходимо.

  6. Публикация элемента ArcGIS StoryMaps.

Важно:

Элемент ArcGIS StoryMaps должен быть доступен для всех, чтобы его можно было встроить в другую веб-страницу.

Копировать фрагмент кода для встраивания

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

  1. Редактирование элемента ArcGIS StoryMaps.

  2. Щелкните кнопку Больше ⋯ в заголовке и выберите Встроить эту историю.

  3. В ниспадающем меню выберите Скрипт (расширенный).

  4. Щёлкните на Копировать.

    Код встраивания скопируется.

Код для встраивания также можно получить при просмотре опубликованного элемента ArcGIS StoryMaps в меню Опубликовать на вкладке Встроить.

Фрагмент кода представляет собой теги <script>, аналогичные тем, что показаны ниже: Разместите второй тег скрипта на странице, куда хотите добавить элемент ArcGIS StoryMaps.

<script>
  window.storyMapsEmbedConfig = {
    storyId: '[StoryMapItemID]',
    rootNode: '.storymaps-root',
  };
</script>
<script src="https://storymaps.arcgis.com/embed/view"></script>

Дополнительные ресурсы

Наверх