Instances de données locales pour plusieurs visualisations

  • Rversion finale: Yokohama
  • Mis à jour 30 janv. 2025
  • 6 minutes de lecture
  • Une ressource de données API de visualisation des données spéciale est disponible pour extraire les données de plusieurs visualisations de données simultanément. Cette ressource de données réduit le nombre d’appels d’API et peut donc accélérer la récupération des données.

    Quand l’utiliser

    Vous pouvez utiliser la ressource de données « API de visualisation de données pour plusieurs visualisations de données » dans les scénarios suivants :
    • Plusieurs visualisations de données du même type ont la même source de données. Par exemple, vous avez cinq visualisations où le type de visualisation est Score unique et la source de données est la table Incident [incident] avec le filtre active=true. Si vous avez plusieurs groupes d’indicateurs avec le même type et la même source de données, vous pouvez créer une instance de la même ressource de données de visualisation multiple pour chaque groupe.
    • Une visualisation des données comporte plusieurs ressources de données qui font référence à la même source de données. Par exemple, vous avez une visualisation de ligne avec une ressource de données de l’indicateur « Nombre d’incidents ouverts » et une autre ressource de données de l’indicateur « Âge moyen des incidents ouverts ». Ces deux indicateurs utilisent la source de données Incident.Ouvert. Pour plus d’efficacité, vous pouvez convertir cette visualisation pour n’utiliser qu’une seule ressource de données.

    Quand ne pas utiliser

    • Il n’y a qu’une seule visualisation sur la Générateur d'IU page.
    • Le chargement des données sur la page prend probablement beaucoup de temps. Dans ce cas, il est préférable de répartir le chargement des données entre des ressources de données distinctes.

    Configurer une ressource de données de visualisation multiple

    Si votre cas d’utilisation répond aux critères d’une ressource de données à visualisations multiples, vous pouvez suivre cette procédure.

    Avant de commencer

    Examiner le cas d’utilisation d’une seule ressource de données pour plusieurs visualisations dans Instances de données locales pour plusieurs visualisations.

    Rôle requis : ui_builder_admin, admin

    Pourquoi et quand exécuter cette tâche

    Important :
    Cette ressource de données fusionne plusieurs appels en un seul. L’appel unique est exécuté comme une transaction unique sur un seul thread. Par conséquent, utilisez cette ressource de données avec une prudence particulière, en particulier lorsque vous manipulez une grande quantité de données, car dans certains cas, cela peut entraîner des délais d’expiration des transactions. Selon la quantité de données, la configuration de la page et l’expérience utilisateur ciblée, vous pouvez obtenir de meilleurs résultats en utilisant des ressources de données distinctes.

    Procédure

    1. Accédez au tableau de bord technique ou à la page UIB avec les visualisations de données.
    2. Vérifiez que les visualisations de données sur la page répondent aux critères de la section Quand utiliser.
      Par exemple, vous avez plusieurs visualisations de cadran sur la source de données de la table Incident et la quantité de données extraites n’est pas trop importante.
    3. Dans le tiroir Données et scripts, sous Ressources de données, sélectionnez + Ajouter une ressource de données.

      Ajoutez un lien de ressource de données lorsqu’il n’y en a pas encore.
    4. Dans la fenêtre Sélectionner une ressource de données, recherchez Visualisation des données.
      Vous obtenez une sélection des ressources de données que vous pouvez utiliser.
      Sélection des ressources de données de l’API de visualisation des données, y compris celle pour plusieurs visualisations de données.
    5. Sélectionnez « API de visualisation de données pour plusieurs visualisations de données ».
    6. Définissez le type sur Configurations de données.
    7. Dans le champ Demande, renseignez le JSON.
      Voir l’exemple à la fin de cette procédure.
    8. Dans chaque visualisation de données pour laquelle vous souhaitez utiliser cette ressource de données, effectuez les actions suivantes :
      1. Sélectionnez la visualisation des données.
      2. Ouvrez le panneau Configuration.
      3. Activez Définir les données manuellement.
      4. Utilisez la liaison de données pour lier un script au champ de données.

    Ressource de données pour trois visualisations à score unique avec la même source de données

    Dans cet exemple, nous commençons par une page UIB qui contient trois composants de visualisation des données. Ces composants sont tous de type de visualisation à score unique et utilisent tous la même source de données.

    Vous suivez la procédure générale jusqu’à l’étape 6. Vous disposez maintenant d’une API de visualisation de données pour plusieurs visualisations de données sur votre page Tableaux de bord.

    Ensuite, vous écrivez le JSON pour la demande, comme suit :
    [
        {
            "details": {
                "visualizationId": "vis_1",
                "followFilter": true
            },
            "configurations": {
                "dataConfigurations": [
                    {
                        "sourceType": "table",
                        "dataCategory": "simple",
                        "order": 0,
                        "tableOrViewName": "incident",
                        "aggregateFunction": "COUNT"
                    }
                ]
            }
        },
        {
            "details": {
                "visualizationId": "vis_2",
                "followFilter": true
            },
            "configurations": {
                "dataConfigurations": [
                    {
                        "sourceType": "table",
                        "dataCategory": "simple",
                        "order": 0,
                        "tableOrViewName": "incident",
                        "aggregateFunction": "AVG",
                        "aggregateField": "business_duration"
                    }
                ]
            }
        },
        {
            "details": {
                "visualizationId": "vis_3",
                "followFilter": true
            },
            "configurations": {
                "dataConfigurations": [
                    {
                        "sourceType": "table",
                        "dataCategory": "simple",
                        "order": 0,
                        "tableOrViewName": "incident",
                        "aggregateFunction": "AVG",
                        "aggregateField": "priority"
                    }
                ]
            }
        }
    ]

    La demande est un tableau d’objets, un pour chaque visualisation de données. Chaque visualisation a une details propriété avec une valeur arbitraire pour le visualizationId et un paramètre booléen followFilter si la visualisation suit les composants de filtre sur la page. Dans ce cas, les trois visualisations suivent des filtres.

    Chaque visualisation possède également une configurations propriété, contenant uniquement un dataConfigurations tableau. Étant donné que toutes les visualisations sont du même type, score unique, et que ce type de visualisation affiche uniquement une valeur simple, les trois dataCategory propriétés sont « simples ». De même, toutes les visualisations utilisent la même source de données. Étant donné que la source de données est la table Incident [incident], les trois visualisations ont une sourceType « table » et une « tableOrViewName incident ». Le seul endroit où les visualisations peuvent varier est dans les agrégats qu’elles utilisent. Ici, vous voyez que le premier utilise une agrégation COUNT, le second prend un agrégat AVG sur le champ business_duration et le troisième prend une AVG du champ de priorité.

    La configuration finale de la ressource de données ressemble à ceci :
    Configuration terminée du courtier en données du tableau de bord.
    Enfin, pour chaque visualisation de données, vous liez le script suivant au champ de données. Vous utilisez la valeur arbitraire visualizationId que vous avez donnée à chaque visualisation comme valeur vizId dans le script pour cette visualisation.
    function evaluateProperty({api, helpers}) {
      const data = api.data.data_visualization_api_for_multiple_data_visualizations_1.output;
    ​
      if (!data) {
        return [];
      }
    ​
      const vizId = 'vis_1';
    ​
      const dataForViz = data.result.find(d => d.details.visualizationId === vizId);
    ​
        return dataForViz.dataResponses;
    }

    Demander le JSON d’un indicateur

    La demande d’une visualisation sur un indicateur diffère de l’exemple précédent, qui concernait une table. Voici le JSON d’une visualisation de séries chronologiques, qui montre une tendance dans le temps, pour l’indicateur Nombre d’incidents ouverts, regroupés par la répartition des priorités :
    [
        {
            "details": {
                "visualizationId": "vis1",
                "followFilter": true
            },
            "configurations": {
                "dataConfigurations": [
                    {
                        "sortBy": "choice",
                        "sortOrder": "asc",
                        "sourceType": "indicator",
                        "dataCategory": "trend",
                        "order": 0,
                        "splitView": false,
                        "numberOfGroups": 2,
                        "uuid": {
                            "indicator": "fb007202d7130100b96d45a3ce6103b4",
                            "breakdowns": []
                        },
                        "trendBy": "anything",
                        "trendInterval": "date",
                        "groupBy": [
                            "0df47e02d7130100b96d45a3ce610399"
                        ],
                        "removeMissingIntervalData": false
                    }
                ]
            }
        }
    ]

    La première différence évidente est que l’indicateur sourceType et la tendance sont la dataCategory tendance. Vous voyez également qu’au lieu d’une tableOrViewName propriété, vous avez un uuid objet avec l’uuid de l’indicateur Nombre d’incidents ouverts et un tableau vide qui pourrait contenir les UUID des répartitions pour filtrer cet indicateur. Étant donné que cette visualisation prend en charge les valeurs groupées, vous disposez d’un groupBy tableau qui, dans ce cas, contient uniquement l’uuid de la répartition des priorités. Avoir un group-by implique un tri, et ici vous voyez que le sortBy est « choix », reflétant le type de données de la répartition des priorités, et le sortOrder est croissant.