Поделиться через

Создание визуального элемента

  • Статья

Этот API предоставляет способ создания нового визуального элемента на странице отчета.

Создание визуального элемента и привязка его к данным

Создайте пустой визуальный элемент определенного типа и привязите визуальный элемент к полям данных. Список типов визуальных элементов см. в встроенных визуальных типов.

Заметка

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

  1. Настройте визуальный элемент, который вы хотите создать, с помощью следующих параметров:

    • тип визуального элемента: тип создаваемого визуального элемента, например barChart.
    • макет (необязательный): макет, применяемый к новому визуальному элементу.
    • автофокус (необязательно): выберите, выполняется ли автоматическая прокрутка страницы до созданного визуального элемента (по умолчанию задано значение True).

  2. Используйте следующий метод для создания визуального элемента:

    createVisual(visualType: string, layout?: models.IVisualLayout, autoFocus?: boolean): Promise<models.ICreateVisualResponse>

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

Например:

let createVisualResponse = await page.createVisual('areaChart');
let visual = createVisualResponse.visual;

Примеры кода

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

Заметка

Сведения о создании пользовательских макетов см. в визуального макета.

Создайте визуальный элемент диаграммы области с пользовательским макетом и без фокуса.

const customLayout = {
    x: 20,
    y: 35,
    width: 1600,
    height: 1200
}

let createVisualResponse = await page.createVisual('areaChart', customLayout, false /* autoFocus */);

Создайте диаграмму области с макетом по умолчанию.

let createVisualResponse = await page.createVisual('areaChart');

Доступные встроенные типы визуальных элементов

  • actionButton

  • areaChart

  • barChart

  • basicShape

  • карточка

  • clusteredBarChart

  • clusteredColumnChart

  • columnChart

  • debugVisual

  • Дерево декомпозиции

  • donutChart

  • esriVisual

  • заполненное изображение

  • воронка

  • измерительный прибор

  • сотниPercentStackedBarChart

  • сотниPercentStackedColumnChart

  • образ

  • keyDriversVisual

  • kpi

  • lineChart

  • lineClusteredColumnComboChart

  • lineStackedColumnComboChart

  • карта

  • multiRowCard

  • pieChart

  • Сводная таблица

  • PowerApps

  • pythonVisual

  • qnaVisual

  • ribbonChart

  • точечная диаграмма

  • scriptVisual

  • shapeMap

  • Среза

  • stackedAreaChart

  • tableEx

  • текстовое поле

  • дерево карты

  • каскадная диаграмма

Рекомендации и ограничения

API создания визуальных элементов доступны только после отрисовки отчета. Прослушивайте отчет rendered события и активируйте API визуального разработки только после вызова. Дополнительные сведения см. в обработки событий .

Связанное содержимое