Afficher l'image d'un graphique depuis Excel Online

Pré-requis


:hourglass: Temps nécessaire : 10 min
:thermometer: Niveau de difficulté : 4/5
:penguin: Sources de données nécessaires : 2 (1 pour cibler le graphique + 1 pour convertir en image)


Afficher l’image d’un graphique depuis Excel Online

Depuis app.pingview.io allez sur le concepteur et accédez aux sources de données

image

Puis créez une nouvelle source Webservice

  1. Nommez la source de donnée

  1. Ajoutez le lien de la requête défini en pré-requis, en y ajoutant la construction suivante :

https://graph.microsoft.com/v1.0/drives/id_drive/items/id_item/workbook/worksheets/Nom_de_la_Feuille/charts(’ Nom_du_graphique ')/Image(width=800)

Ainsi cette requête permet de cibler :

a. id_item : ID du fichier excel

b. Nom_de_la_feuille : Nom la feuille ciblée dans le excel online
(Attention si vous renommez la feuille, il faudra modifier le nom dans la requête également)

Capture d’écran 2021-12-21 à 14.53.14

c. Nom_du_graphique : Nom du graphique sur la feuille, cette information se trouve en haut à gauche de excel online
(Attention à ne pas confondre le Nom du graphique et le Titre du graphique)

Capture d’écran 2021-12-21 à 14.53.39

Votre URL doit ressembler à l’exemple ci dessous :

Capture d’écran 2021-12-21 à 14.46.44

  1. Ajoutez votre jeton OAuth

Puis testez !

Votre résultat apparait bien sur la droite de votre écran :

Pensez à cliquer sur les résultats obtenus ou directement « Ajouter toutes les données »
Les données sont correctement selectionnées si elles apparaissent en vert dans la partie supérieure, et sont présentes dans l’encart du dessous :

A présent créez une source enfant => Formule :

Capture d’écran 2021-12-20 à 17.50.52

Capture d’écran 2021-12-20 à 17.51.01

  1. Nommez la
  2. Donnez un nom à la formule (ce sera le nom de la source à afficher)
  3. Insérez la formule suivante :

'data:image/png;base64,'+{{value}}

Capture d’écran 2021-12-20 à 17.59.17

Puis testez, et selectionnez le résultat de la formule ainsi affiché.
Dans cet exemple « ImageGraphique ».

Capture d’écran 2021-12-20 à 18.04.53

C’est cette donnée que nous allons appeler dans un widget Image depuis le concepteur.
Ajoutez le widget image sur la slide
Pour cet exemple nous utiliserons la saisie libre, pour cela saisir 2 doubles accolades {{ dans le champs « Saisie libre » , puis accédez à votre source :

Capture d’écran 2021-12-20 à 18.07.19

Capture d’écran 2021-12-20 à 18.07.29

Votre graphique apparairait à présent sur votre écran !

Vous pouvez modifier la définition de l’image en ajustant la taille en pixels qui se trouve à la fin de la requête :
(Width = XXX)

Capture d’écran 2021-12-20 à 18.14.16

N’oubliez pas de sauvegarder lorsque vous procédez à des changements !