Partager via

Créer un visuel

  • Article

Cette API permet de créer un visuel sur une page de rapport.

Comment créer un visuel et le lier à des données

Créez un visuel vide d’un type spécifique, puis liez le visuel aux champs de données. Pour obtenir la liste des types visuels, consultez types visuels prêtes à l’emploi.

Note

Les visuels qui ne sont pas installés dans le volet de visualisation ne peuvent pas être ajoutés à un rapport. Cela est vrai pour les deux visuels personnalisés qui ne sont pas installés et des visuels prêtes à l’emploi qui ont été désinstallés.

  1. Configurez le visuel que vous souhaitez créer à l’aide des paramètres suivants :

    • type de visuel: type de visuel que vous souhaitez créer, tel qu’un barChart.
    • Disposition (facultative) : disposition à appliquer au nouveau visuel.
    • autoFocus (facultatif): indiquez si la page défile automatiquement vers le visuel nouvellement créé (défini sur « True » par défaut).

  2. Utilisez la méthode suivante pour créer votre visuel :

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

La valeur retournée contient un objet qui représente le visuel nouvellement créé. Vous pouvez utiliser les liaison de données visuelles et propriétés visuelles API pour modifier le visuel en fonction de vos besoins.

Par exemple:

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

Exemples de code

Les exemples de code suivants montrent comment créer des visuels avec différents paramètres.

Note

Pour plus d’informations sur la création de dispositions personnalisées, consultez de disposition visuelle.

Créez un visuel de graphique en aires avec une disposition personnalisée et aucun focus.

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

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

Créez un graphique en aires avec une disposition par défaut.

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

Types visuels prêtes à l’emploi disponibles

  • actionButton

  • areaChart

  • barChart

  • basicShape

  • carte

  • clusteredBarChart

  • clusteredColumnChart

  • columnChart

  • debugVisual

  • Arborescence de décomposition

  • donutChart

  • esriVisual

  • filledMap

  • entonnoir

  • jauge

  • centPercentStackedBarChart

  • centPercentStackedColumnChart

  • image

  • keyDriversVisual

  • kpi

  • lineChart

  • lineClusteredColumnComboChart

  • lineStackedColumnComboChart

  • carte

  • multiRowCard

  • graphique en secteurs

  • tableau croisé dynamique

  • PowerApps

  • pythonVisual

  • qnaVisual

  • RibbonChart

  • nuage de points

  • scriptVisual

  • shapeMap

  • Trancheuse

  • stackedAreaChart

  • tableEx

  • zone de texte

  • treemap

  • graphique en cascade

Considérations et limitations

Les API de création visuelle sont disponibles uniquement après le rendu du rapport. Écoutez le rapport rendered événement et déclenchez des API de création visuelle uniquement après son appel. Pour plus d’informations, consultez de gestion des événements.

Contenu connexe