Interfaces_graphique_avec_R, Study Guides, Projects, Research of Informatics Engineering

Download Interfaces_graphique_avec_R and more Study Guides, Projects, Research Informatics Engineering in PDF only on Docsity!

Interfaces

graphiques

avec R

et shiny

Réalisé par :

DADDA Karima

RAKIB Soukaina

Encadré par :

Pr O. Obra

Table des matières

• I. Shiny
• II. Les données
• III. Les packages R
• IV. Création de l’architecture
  • Mise en place d’un dashboard :
  • Ajouter un titre :
  • Ajouter des pages :
• V. Création d’un lecteur de fichier :
  • Importer un fichier.............................................................................................................................................
  • Zone de paramétrage.........................................................................................................................................
  • Zone de prévisualisation
  • Bouton de lecture
  • Changement de page
• VI. Visualisation...............................................................................................................................................
  • Exploration du tableau
• VII. Visualisation graphique
  • Graphique avec R
  • Graphique par ggplot2
  • Graphique Plotly
  • Graphique Google............................................................................................................................................
  • Gérer le tableau vide
• VIII. Interagir avec les graphique
  • Sélectionner les données à afficher à l’aide du tableau
  • Changement de couleur pour le graphique de base R
• IX. PYTHON À L'INTÉRIEUR DE R SHINY
• X. Conclusion

shinydashboard : Il permettra de créer une architecture dynamique à la page web avec une zone de titre, une menu rabattable et une zone principale shinyWidgets : Il permettra de mettre un message d’alerte pour confirmer la lecture correcte du tableau DT : Il permettra de créer un tableau dynamique avec de la coloration conditionnelle plotly , ggplot2 et googleVis : Ils nous permettront de réaliser des graphiques colourpicker : Il permettra à l’utilisateur de sélectionner une couleur. Nous utiliserons pour les installer et les charger un autre package : anylib. Ce package est très pratique car il permet d'installer et de charger une liste de package.

IV. Création de l’architecture

Mise en place d’un dashboard :

Pour mettre en forme notre application web (la partie UI visible par l’utilisateur), nous allons utiliser le package shinydashboard. L'architecture minimale avec shinydasbord est zone de titre (bleue), une barre latérale (noir) et une zone principale (grise).

Ajouter un titre :

Dans la fonction dashboardHeader, nous ajoutons un titre à l’application (ici bioinformatique). Ce titre sera affiché en haut à gauche.

Ajouter des pages :

La première étape est d’ajouter des éléments (item) dans la barre de menu latérale (partie noire). Nous utilisons pour cela la fonction dashboardSidebar. Nous y ajoutons la fonction sidebarMenuqui contient les items du menu. Ensuite, il faut indiquer que la partie body aura plusieurs pages (des tabItems). Chaque tabItem correspond à une page accessible par le menu. Le menuItem doit avoir le même nom que l’argument tabName de la fonction tabItem pour y accéder (exemple : readData). Dans chaque page, nous ajoutons un titre de niveau 1 (h1). Vous pouvez remarquer l'utilisation de la fonction icon (icon = icon(...)). En utilisant cette fonction, vous aurez une petite image (icônes) à gauche du nom de l'élément (par exemple un livre pour la lecture des données). Il est aussi possible de l'utiliser pour des boutons.

V. Création d’un lecteur de fichier :

L’objectif est de proposer une interface simple pour lire un fichier dans l’application et qui permette à l’utilisateur de paramétrer la lecture et d’avoir une prévisualisation du fichier lu.

Importer un fichier

Pour importer un fichier, shiny propose la fonction fileInput. Il est possible d’importer ou de sélectionner un fichier dans l’explorateur de fichiers. Le type de fichier visible est paramétrable dans les arguments. Ici, nous utiliserons le paramétrage par défaut.

Zone de paramétrage

Nous souhaitons maintenant paramétrer 3 points lors de la lecture du fichier : type de séparateur (virgule, tabulation, espace), type de quote (simple, double, aucune) et la présence/absence des noms de colonnes (header). Nous utilisons pour cela des radio boutons. La fonction utilisée est radioButtons. 5 arguments sont utilisés :

Côté Server

Nous souhaitons à présent afficher de l’information. Du côté serveur, pour envoyer de l’information, la syntaxe commence quasiment toujours par output$ puis l’ID de la zone de sortie (ici notre tableau de prévisualisation avec l’id "preview"). Ce que nous souhaitons lui envoyer est un tableau. Nous utilisons donc la fonction <- renderDataTable({ }). Dans cette dernière fonction, nous allons lire le tableau qui va être renvoyé. Pour récupérer de l’information du côté UI, il faut utiliser la syntaxe suivante : input$ID. Par exemple, nous souhaitons récupérer le choix de l'utilisateur concernant le header : input$header.

req(input$dataFile) : bloque la suite du code si la zone d’import de fichier est vide df <- read.csv() : on stocke dans df la lecture du fichier input$dataFile$datapath : chemin d’accès au fichier importé header = as.logical(input$header) : récupération de la réponse de l’utilisateur pour savoir si présence ou absence d’un header. Le as.logical permet de convertir un TRUE ou FALSE en booléen. sep = input$sep, quote = input$quote : récupération du paramétrage de l’utilisateur pour le séparateur et les quotes. Ces informations sont données aux arguments de la fonction read.csv() nrows=10 : Nous ne souhaitons pas lire tout le fichier. Seules les premières lignes sont nécessaires pour savoir si le tableau est lu correctement ou non. Nous lisons donc les 10 premières lignes. options = list(scrollX = TRUE , dom = 't') : Si le tableau a de nombreuses colonnes, cette option permet d’avoir un scroll horizontal Vous pouvez maintenant tester sur un fichier texte contenant un tableau. Le changement de paramétrage a un effet direct sur la visualisation.

Visualisation de l’application

Bouton de lecture

Pour finir avec cette page, nous allons créer un bouton pour valider le paramétrage de la lecture du tableau. En cliquant sur ce bouton, l’ensemble du fichier sera lu. Nous ne réalisons pas une lecture dynamique comme précédemment. En effet, à chaque changement de paramètre, l’ensemble du fichier est relu. Si le fichier est gros, le temps de lecture sera long.

Côté UI Nous ajoutons un actionButton. L’identifiant de notre bouton est "actBtnVisualisation".

Côté serveur

Lorsque que le bouton est cliqué, nous souhaitons à présent que le contenu du fichier soit stocké dans une variable. Il s’agit d’une variable particulière. Elle doit être visible par toutes les fonctions côté serveur et relancer toutes les fonctions qui l’utilisent si elle change. Il s’agit d’une variable réactive (reactiveValues). Si nous détaillons le code : Nous déclarons une reactiveValue avec comme nom data. Nous allons utiliser une fonction qui permet d’attendre une action particulière. Ici nous attendons que l’utilisateur clique sur le bouton. Une fois que le bouton a été cliqué, le code entre les { } sera exécuté. Ici, l’objectif sera de stocker le contenu du fichier importé dans la reactiveValue sous le nom table (data$table)

Ainsi, à chaque clic du bouton, data$table sera mis à jour ainsi que toutes les fonctions qui l’utilise Nous pouvons aussi ajouter un message pour confirmer la lecture du fichier. Nous utiliserons sendSweetAlert proposé dans le package shinyWidgets.

Il est possible de faire de la mise en forme conditionnelle comme dans excel. Le code proposé par la suite est dépendant du tableau utilisé. En effet, nous allons cibler les colonnes d’intérêt par leur nom pour une question de lisibilité.

Voici une proposition de mise en forme conditionnelle de notre Histogramme des valeurs pour les colonnes Sepal.length et Petal.length

Coloration par seuils multiples pour les colonnes Sepal.width et Petal.width (fond blanc écriture noire, fond rouge écriture blanche et fond rouge foncé écriture blanche) Coloration du fond en fonction de l’espèce pour la colonne espèce.

Enfin, pour améliorer l’exploration, il est possible d’ajouter des filtres par colonnes. Pour les valeurs numériques, les données sont filtrées par un slider. Pour les colonnes contenant du texte, il y a deux possibilités :

Peu de variabilité entre les éléments. Par exemple, la colonne Species ne contient que 3 éléments différents : setosa, versicolor et virginica. Dans ce cas, le filtre sera composé des éléments uniques de cette colonne qui seront cliquables. En les cliquant, toutes les lignes avec cet élément seront sélectionnées. Grande variabilité entre les éléments. Dans ce cas, une zone pour entrer du texte sera proposée. Le texte saisi sera recherché dans la colonne.

VII. Visualisation graphique

Nous allons créer de 4 façons différentes des graphiques et les afficher dans l’application shiny :

des graphiques statiques un plot de base avec R un graphique avec ggplot des graphiques dynamiques Avec plotly Avec google Les graphiques seront représentés sur la même ligne avec une fluidRow et 4 colonnes.

Graphique avec R

R propose une grande palette de graphiques de base. Cependant, il s'agit uniquement de graphiques statiques.

Côté UI Il faut comme précédemment créer une zone pour indiquer où va être affiché le graphique. La fonction utilisée est plotOutput.

Visualisation de l’application

Côté UI

De nouveau, nous allons créer une zone pour afficher le graphique et Nous utiliserons cette fois la fonction plotlyOutput.

Côté serveur

Vous pouvez mettre n’importe quel graphique plotly dans la fonction. Ici, nous comparons la largeur et la longueur des pétales.

Graphique Google

Pour finir, les graphiques de Google sont de plus en plus populaires et offrent un plus large choix de représentations que Plotly (calendrier, etc.). Ici, nous allons réaliser un histogramme de la largeur des pétales.

Côté UI Nous créons de nouveau une zone pour afficher le graphique. La fonction utilisée est htmlOutput. Cette fonction est capable d’interpréter du code HTML venant du serveur. Si vous souhaitez écrire du HTML directement dans la partie UI, il vous suffit d’utiliser la fonction HTML (ex : HTML(“Titre 1”).

Côté serveur

Pour les graphiques Google, nous utilisons les fonctions graphiques commençant par gvis et le rendu est fait avec la fonction renderGvis.

Gérer le tableau vide

En lançant l’application, si vous vous rendez sur la partie visualisation, vous trouverez plein d’erreurs. Ces erreurs sont la cause de l’utilisation d’une reactiveValue. En effet, lorsque rien n’a encore été lu, data$table est NULL (vide). Or toutes les fonctions que nous utilisons ne gèrent

pas les NULL. Nous ajouterons pour le tableau et les graphiques un peu de code pour lui dire de renvoyer NULL si le tableau est vide.

VIII. Interagir avec les graphique

Nous allons voir deux types d'interactions avec les graphiques pour illustrer la simplicité pour l’utilisateur d'interagir avec les données et les représentations :

Sélectionner les données à afficher à l’aide du tableau Changer des paramètres graphiques sur le plot de base proposé par R. Tous ces changements peuvent bien sûr être appliqués sur tous les graphiques.

Sélectionner les données à afficher à l’aide du tableau

Grâce à Shiny, il est possible de faire communiquer le tableau avec les graphiques. Nous profitons pour cela de la puissance du package DT qui génère le tableau. Les modifications que nous allons réaliser seront uniquement côté serveur. L'objectif est de récupérer les lignes qui sont affichées dans le tableau et de n'utiliser que ces lignes dans les graphiques. Comme précédemment, pour récupérer de l’information dans l’UI, il faut utiliser input$ID_ZONE. Nous souhaitons récupérer de l'information de notre tableau qui a comme identifiant dataTable. Ensuite, nous ajoutons _rows_all à la fin de l’ID pour obtenir les lignes. Ainsi, avec input$dataTable_rows_all, nous avons les lignes affichées dans le tableau.

La même démarche est ensuite appliquée aux autres graphiques. Grâce aux filtres du tableau, nous avons ainsi la possibilité de sélectionner par les données numériques (longueur et largeur) et par l’espèce.

Changement de couleur pour le graphique de base R

L’objectif est de vous montrer une autre façon d'interagir avec les graphiques. En effet, il se peut que vous n’utilisiez pas de tableau dans votre application. Nous allons implémenter 4 changements sur ce graphique pour vous donner des exemples d’utilisation d’inputs : Changement de la couleur des points (avec l’utilisation d’un colour picker capable de gérer la transparence) Changement du type de point

IX. PYTHON À L'INTÉRIEUR DE R SHINY

On veux maintenant obtenir le nombre sélectionné de taille à partir du curseur et passer ce nombre dans une méthode python et faire des calculs / manipulations , puis renvoie une valeur à mon tableau de bord R et affiche le résultat dans un champ de texte.

Étape 0 1 Créez un textOutput dans le coté ui. pour afficher la sortie finale.

Étape 0 2 Créez un gestionnaire sur server.R en créant un composant renderText pour le textOutput

Étape 0 3 Créez un nouveau script Python appelé python.py et insérez le code suivant.

Visualisation de l’application

def testMethod(cex) : obtenir la taille de points sélectionner par R shiny server noOfCex = str(cex) : convertir int en string return "Vous avez sélectionné " +noOfCex+ " de taille " : affiche le résultat

Étape 04

Importer une bibliothèque de réticulations. library(reticulate) qui permet une interface entre R et Python.

Étape 0 5 :

Utiliser La fonction source_python() pour générer un script Python et rendre les objets qu'elle crée disponibles dans un environnement.

X. Conclusion

Nous avons réalisé une application complète capable de lire un fichier en fonction de paramètres et d'explorer ses données. A travers ce rapport , nous avons vu comment rendre interactive l’exploration d’un tableau de données à l’aide de package Shiny.

Visualisation de l’application