Учебное пособие по мэшап Qlik Sense Mashup – 9 шагов для создания мэшапа
Давайте начнем новый урок по очень интересной функции Qlik Sense – мэшап-приложения в Qlik Sense Mashup. В этом уроке мы сначала изучаем основы мэшап-приложений, а затем узнаем о компонентах, создании мэшап-приложений и соответствующих API-интерфейсах для мэшап-приложений.
Итак, приступим к изучению мэшапов в Qlik Sense.
Учебное пособие по мэшапам Qlik Sense – преимущества и компоненты
1. Введение в мэшап Qlik Sense Mashup
Мэшап Qlik Sense – это веб-страница, веб-сайт или веб-приложение, в котором используются объекты Qlik Sense из одного или нескольких приложений Qlik Sense чтобы создать уникальную веб-службу с одним графическим интерфейсом. Другими словами, мэшап – это комбинация веб-API Qlik Sense с веб-платформой, обеспечивающей веб-интеграцию с Qlik Sense. Вы можете создавать адаптивные веб-страницы или веб-сайты, используя данные и визуализации из приложений Qlik Sense.
2. Компоненты мэшапа Qlik Sense
Давайте теперь поговорим о компонентах мэшапа Qlik Sense.
i. Приложение Qlik Sense
Это приложение, созданное в Qlik Sense, которое является основным источником данных или объектов, которые будут использоваться в мэшап-приложении. Вы можете использовать данные или объекты из нескольких приложений Qlik Sense в одном мэшап-приложении.
ii. Компоненты веб-разработки (скрипты)
Существуют различные сценарии веб-разработки, которые позволяют создавать мэшапы.
HTML: код сценария HTML похож на самую простую форму веб-страницы, на которой есть все необходимые инструкции. Он определяет структуру или макет веб-страницы.
JavaScript: код JavaScript обеспечивает логику и определяет поведение веб-страницы. Это делает веб-страницу отзывчивой и интерактивной.
CSS: сценарий CSS определяет представление и форму веб-страницы. Он отвечает за всю графику и дизайн мэшапа.
Файлы Qext и wbl: файл .qext хранит все детали (параметры) расширения Qlik. Также файл .wbl содержит список манифестов файлов, включенных в текущий проект мэшап-приложения.
3. Преимущества мэшапа в Qlik Sense Mashup
- Мэшап-приложения Qlik Sense полезны для пользователей во многих отношениях.
- Мэшап-приложения позволяют легко интегрировать приложения Qlik Sense и их объекты в Интернет.
- Предлагает большую гибкость пользовательского интерфейса с точки зрения дизайна (цвет фона и т. д.) и функций.
- Мэшап-приложения позволяют интегрировать Qlik Sense в веб-платформу с использованием HTML, CSS, JavaScript и т. д.
4. API-интерфейсы Qlik Sense мэшапа (Qlik Sense Mashup APIs)
Для создания гибридного приложения Qlik Sense существуют интерфейсы прикладного программирования (API), доступные для различных целей и задач. Вам просто нужно скопировать и вставить фрагмент кода для API-метода и соответствующим образом изменить его, чтобы добавить объекты приложения на свой выбор в мэшап. Это позволяет легко встраивать различные элементы и максимально гибко разрабатывать мэшап.
Ниже представлены несколько API-интерфейсов, относящихся к разработке мэшап-приложений. Вы можете получить коды для вставки различных элементов, таких как движок, серверная часть, интерфейс (приложение), корень, закладка, переменные и т. д. Вы также можете изменить эти коды в соответствии с вашими требованиями для создания веб-страницы. Коды API обычно берутся из библиотек JavaScript или JSON.
- Engine API
- Backend API
- Root API
- App API
- Bookmark API
- Field API
- Global API
- Table API
- Selection API
- Variable API
- Visualization API
- App Integration API
- Single Integration API
- Qlik-visual (web component)
- Enigma.js
- Leonardo-ui (web component)
5. Как создать мэшап Qlik Sense Mashup?
Давайте научимся создавать мэшап Qlik Sense с помощью Qlik Sense Desktop.
Шаг 1. Откройте Qlik Sense Desktop, а затем перейдите в Центр разработки (Qlik Sense Development Hub), показанный на изображении ниже.
Шаг 2: Вас перенаправят в веб-браузер. Здесь откроется центр разработки Qlik (Qlik Dev Hub).
Шаг 3: Нажмите на создание нового мэшап-приложения в Dev Hub. Введите имя мэшапа и выберите шаблон для него.
Вы можете выбрать один из четырех доступных шаблонов мэшап-приложений.
Шаг 4: Мы продвигаемся к нашему объяснению, выбирая «Базовый одностраничный гибридный веб-сайт». Откроется редактор мэшапов.
Шаг 5: Затем мы выберем приложение, объекты которого мы можем использовать в нашем мэшапе, из опции «Выбрать приложение».
Мы выбрали пример приложения под названием «Helpdesk management». Все содержимое или объекты приложения загружаются в редактор мэшап-приложений, как только вы выбираете приложение.
Шаг 6: В типичном окне редактора мэшап-приложений есть отдельные вкладки для разных наборов кода, то есть для qext, HTML, JavaScript, CSS, и одно окно для изображений (jpg или png). Каждый сценарий вносит свой вклад в создание полного и интерактивного мэшап веб-сайта.
Скрипт Qext
Скрипт HTML
Код JavaScript
Код CSS
Окно изображения.
Шаг 7. На панели предварительного просмотра вы можете перетаскивать объекты из выбранного приложения, как показано на скриншоте ниже.
Шаг 8: Вы можете просмотреть созданный мэшап веб-сайт на новой вкладке в браузере, нажав на опцию «Просмотр», расположенную внизу.
Шаг 9: Он показывает мэшап, созданный в Qlik Dev Hub, в виде веб-страницы.
Графики и диаграммы, показанные на веб-странице, являются адаптивными и меняются в зависимости от сделанного выбора.
В верхней части веб-страницы находится панель навигации, с помощью которой вы можете очистить выбор, перейти назад и вперед, создать закладки и заблокировать/разблокировать состояния выбора. Такие операции аналогичные тем, которые есть на информационной панели приложения Qlik Sense.
Вы можете изменять приложения по своему усмотрению, добавляя новые фрагменты кода в скрипт HTML, JavaScript или CSS. Вы можете добавить объекты, не относящиеся к Qlik. Обычно для добавления объектов, не относящихся к Qlik, в мэшап используются два типа объектов: список и гиперкуб.
Список состоит из значений данных из измерений, мер и полей. Вы можете создавать собственные фильтры или раскрывающиеся списки, используя опцию списка. Как только вы добавляете список, код будет добавлен в HTML-скрипт. В списках есть возможность выбора.
Гиперкуб создает адаптивные трехмерные кубы. В одном гиперкубе вы можете иметь набор значений, таких как измерения, меры и поля, все вместе. В редакторе гибридных веб-приложений есть построитель гиперкубов, с помощью которого вы можете добавлять объекты гиперкуба в мэшап веб-приложение.
Таблица, показанная на изображении ниже, создана построителем гиперкуба. Это адаптивная таблица, содержимое которой изменяется при любом выборе, сделанном на веб-странице.
