Share via

Демонстрация представлений отчетов

  • Статья

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

На тестовой площадке встроенной аналитики Power BI в представлении отчетов используется API закладок для предоставления пользователям доступа к закладкам, записи, сохранения и совместного использования закладок.

Пользователи могут:

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

Демонстрация представлений отчетов

В демонстрации представлений отчетов сбор данных во встроенном отчете Power BI воображаемый конгломерат Contoso отображает данные о производительности. В отчете используются Q&A, две многостроковые карточки, матрица и гистограммы для отображения данных за 2014 год по всем их производителям, продуктам и регионам. Визуальные элементы имеют элементы управления фильтром и срезом, чтобы пользователи могли сузить и просмотреть части данных.

Настройка представления

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

Снимок экрана: визуализации и элементы управления в представлении отслеживания отчетов.

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

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

Сохранение закладки

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

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

Снимок экрана: список закладок с выбранным созданным представлением.

Общий доступ к закладке

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

Снимок экрана: диалоговое окно

Просмотр представления с закладками

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

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

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

Сбор кода демонстрации представлений отчетов

Код для реализации демонстрации находится в репозитории PowerBI-Embedded-Showcases на GitHub.

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

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

В классе applyBookmarksManager отчета применяет ранее сохраненную закладку по имени, capture захватывает и возвращает строку, представляющую текущее состояние отчета, и applyState применяет ранее записанное состояние. При применении сохраненной закладки ее можно указать с помощью name или state.

Дополнительные сведения об операциях закладки и API см. в разделе Закладки отчетов.

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

Код демонстрации декодирует имя закладки из аргумента URL-адреса id представления и получает закладку из локального хранилища. Демонстрация использует локальное хранилище для простоты, но вы можете использовать любую базу данных. Атрибут bookmark в отчете embedConfiguration применяет закладку при загрузке.

async function embedSharedBookmarkReport() {
    ...
    // Get the bookmark name from url param
    let bookmarkName = getBookmarkNameFromURL();

    // Get the bookmark state from local storage
    let bookmarkState = localStorage.getItem(bookmarkName);

    // Embed configuration used to describe the what and how to embed
    let config = {
        ...
        // Adding bookmark attribute will apply the bookmark on load
        bookmark: {
            state: bookmarkState
        }
    };

Захват представления и сохранение его в списке закладок

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

        // Capture the report's current state with personalized visuals
        const capturedBookmark = await bookmarkShowcaseState.report.bookmarksManager.capture({ personalizeVisuals: true });

        // Build bookmark element
        let bookmark = {
            name: "bookmark_" + bookmarkShowcaseState.bookmarkCounter,
            displayName: capturedViewname,
            state: capturedBookmark.state
        }

        // Add the new bookmark to the HTML list
        bookmarksList.append(buildBookmarkElement(bookmark));

        // Open the bookmarks list div and show the applied bookmark
        bookmarksList.addClass("show position");

        bookmarksDropdown.addClass(displayClass);
        ...

        // Set the captured bookmark as active
        const newBookmark = "bookmark_" + bookmarkShowcaseState.bookmarkCounter;
        setBookmarkActive($(newBookmark));

Отображение выбранного представления из списка закладок

Этот код задает выбранную закладку как активную, выделяет ее в списке закладок и применяет активное состояние.

function onBookmarkClicked(element) {

    // Set the clicked bookmark as active
    setBookmarkActive($(element));

    // Apply respective color to the label of the bookmark
    applyColor(element.id);

    // Get bookmark ID from HTML
    const bookmarkId = $(element).attr("id");

    // Find the bookmark in the bookmarks array
    let currentBookmark = getBookmarkByID(bookmarkId);

    // Apply the bookmark state
    bookmarkShowcaseState.report.bookmarksManager.applyState(currentBookmark.state);
}

Дальнейшие действия