Compartilhar via

Criar um visual

  • Artigo

Essa API fornece uma maneira de criar um novo visual em uma página de relatório.

Como criar um visual e associá-lo aos dados

Crie um visual vazio de um tipo específico e, em seguida, associe o visual aos campos de dados. Para obter uma lista de tipos visuais, consulte tipos visuais prontos para uso.

Nota

Visuais que não estão instalados no painel de visualização não podem ser adicionados a um relatório. Isso é verdadeiro para visuais personalizados que não estão instalados e visuais prontos para uso que foram desinstalados.

  1. Configure o visual que você deseja criar usando os seguintes parâmetros:

    • tipo visual: o tipo de visual que você deseja criar, como um barChart.
    • Layout (opcional): o layout a ser aplicado ao novo visual.
    • autoFocus (opcional): escolha se a página rola automaticamente para o visual recém-criado (definido como 'True' por padrão).

  2. Use o seguinte método para criar seu visual:

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

O valor retornado contém um objeto que representa o visual recém-criado. Você pode usar as de associação de dados visuais e as propriedades visuais APIs para editar o visual de acordo com suas necessidades.

Por exemplo:

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

Exemplos de código

Os exemplos de código a seguir mostram como criar visuais com parâmetros diferentes.

Nota

Para obter informações sobre como criar layouts personalizados, consulte layout visual.

Crie um visual de gráfico de área com um layout personalizado e sem foco.

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

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

Crie um gráfico de área com um layout padrão.

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

Tipos visuais prontos para uso disponíveis

  • actionButton

  • areaChart

  • barChart

  • basicShape

  • cartão

  • clusteredBarChart

  • clusteredColumnChart

  • columnChart

  • debugVisual

  • Árvore de decomposição

  • donutChart

  • esriVisual

  • filledMap

  • funil

  • medida

  • hundredPercentStackedBarChart

  • hundredPercentStackedColumnChart

  • imagem

  • keyDriversVisual

  • kpi

  • lineChart

  • lineClusteredColumnComboChart

  • lineStackedColumnComboChart

  • mapa

  • multiRowCard

  • pieChart

  • tabela dinâmica

  • PowerApps

  • pythonVisual

  • qnaVisual

  • ribbonChart

  • gráfico de dispersão

  • scriptVisual

  • shapeMap

  • Cortador

  • stackedAreaChart

  • tableEx

  • caixa de texto

  • mapa de árvore

  • waterfallChart

Considerações e limitações

As APIs de criação visual só estão disponíveis depois que o relatório é renderizado. Ouça o relatório rendered evento e dispare APIs de criação visual somente depois que ele for chamado. Consulte de tratamento de eventos para obter mais informações.

Conteúdo relacionado