Créez votre premier tableau de bord d'application Web avec Shiny et R

L'un des beaux cadeaux de R (que Python a manqué, jusqu'au tiret) est Shiny . Brillant est un R package qui le rend facile de construire des applications web interactives directement à partir de R . Les tableaux de bord sont populaires car ils aident les entreprises à tirer parti des données existantes.

Dans cet article, nous verrons comment tirer parti de Shiny pour créer un tableau de bord simple des revenus des ventes. Vous aurez besoin de R installé.

Chargement de packages dans R

Les paquets dont vous avez besoin doivent être téléchargés séparément et installés à l' aide R . Tous les packages listés ci-dessous peuvent être directement installés à partir de CRAN, vous pouvez choisir le miroir CRAN à utiliser. Les dépendances de package seront également téléchargées et installées par défaut.

Une fois les packages installés, vous devez les charger dans votre session R. La bibliothèque et nécessitent des commandes sont utilisées et, de nouveau, les dépendances de paquets sont également chargés automatiquement par R .

# load the required packageslibrary(shiny)require(shinydashboard)library(ggplot2)library(dplyr)

Exemple de fichier d'entrée

Étant donné qu'un tableau de bord a besoin de données d'entrée à visualiser, nous utiliserons recommandation.csv comme exemple de données d'entrée dans notre tableau de bord. Comme il s'agit d'un fichier .csv, la commande read.csv a été utilisée. La première ligne du .csv est une ligne de titre, donc header = T est utilisé. Il existe deux façons d'obtenir le fichier recommandation.csv dans votre session R actuelle:

  1. Ouvrez ce lien - recommendation.csv et enregistrez- le (Ctrl + S) dans votre répertoire de travail actuel, où ce code R est enregistré. Ensuite, le code suivant fonctionnera parfaitement.
recommendation <- read.csv('recommendation.csv',stringsAsFactors = F,header=T)head(recommendation) Account Product Region Revenue1 Axis Bank FBB North 20002 HSBC FBB South 300003 SBI FBB East 10004 ICICI FBB West 10005 Bandhan Bank FBB West 2006 Axis Bank SIMO North 200

2. Au lieu de lire le .csv depuis votre ordinateur local, vous pouvez également le lire depuis une URL (web) en utilisant la même fonction read.csv. Comme ce .csv est déjà téléchargé sur mon Github, nous pouvons utiliser ce lien dans notre read.csv pour lire le fichier.

recommendation <- read.csv('//raw.githubusercontent.com/amrrs/sample_revenue_dashboard_shiny/master/recommendation.csv',stringsAsFactors = F,header=T)head(recommendation) Account Product Region Revenue1 Axis Bank FBB North 20002 HSBC FBB South 300003 SBI FBB East 10004 ICICI FBB West 10005 Bandhan Bank FBB West 2006 Axis Bank SIMO North 200

Présentation de Shiny

Chaque application Shiny comporte deux sections principales: l' interface utilisateur et le serveur . L'interface utilisateur contient le code pour les boutons frontaux, les graphiques de tracé, les onglets, etc. Le serveur contient le code pour le back-end, comme la récupération, la manipulation et la manipulation de données.

Au lieu d'utiliser simplement Shiny , nous l' associons à un shinydashboard . shinydashboard est un package R dont le travail est de faciliter, comme son nom l'indique, la création de tableaux de bord avec Shiny .

Création d'un tableau de bord rempli: interface utilisateur

La partie UI d'une application Shiny construite avec shinydashboard comporte 3 éléments de base enveloppés dans la commande dashboardPage (). Le code Shiny le plus simple avec shinydashboard

## app.R ##library(shiny)library(shinydashboard)ui <- dashboardPage( dashboardHeader(), dashboardSidebar(), dashboardBody())server <- function(input, output) { }shinyApp(ui, server)

donne cette application

Laissez-nous peupler dashboardHeader()et dashboardSidebar(). Le code contient des commentaires, préfixés par #.

#Dashboard header carrying the title of the dashboardheader <- dashboardHeader(title = "Basic Dashboard") #Sidebar content of the dashboardsidebar <- dashboardSidebar( sidebarMenu( menuItem("Dashboard", tabName = "dashboard", icon = icon("dashboard")), menuItem("Visit-us", icon = icon("send",lib='glyphicon'), href = "//www.salesforce.com") ))

Les éléments de l'interface utilisateur que nous aimerions afficher dans notre tableau de bord sont remplis dashboardPage(). Étant donné que l'exemple est un tableau de bord des revenus des ventes, montrons trois cases d'indicateur de performance clé (KPI) en haut qui représentent un résumé rapide, suivies de deux boîtes à moustaches pour une vue détaillée.

Pour aligner ces éléments, un par un, nous les définissons à l'intérieur fluidRow().

frow1 <- fluidRow( valueBoxOutput("value1") ,valueBoxOutput("value2") ,valueBoxOutput("value3"))frow2 <- fluidRow( box( title = "Revenue per Account" ,status = "primary" ,solidHeader = TRUE ,collapsible = TRUE ,plotOutput("revenuebyPrd", height = "300px") ) ,box( title = "Revenue per Product" ,status = "primary" ,solidHeader = TRUE ,collapsible = TRUE ,plotOutput("revenuebyRegion", height = "300px") ) )# combine the two fluid rows to make the bodybody <- dashboardBody(frow1, frow2)

Dans le code ci-dessus, valueBoxOutput()est utilisé pour afficher les informations KPI. valueBoxOutput()et plotOutput()sont écrits dans la partie Serveur , qui est utilisée dans la partie UI pour afficher un tracé. box()est une fonction fournie par shinydashboardpour enfermer le tracé dans une boîte contenant des fonctionnalités telles que title, solidHeaderet collapsible. Après avoir défini deux fluidRow()fonctions individuellement dans un souci de modularité, nous les combinons dans dashbboardBody().

Ainsi, nous pouvons compléter la partie UI , comprenant l'en-tête, la barre latérale et la page, avec le code ci-dessous:

#completing the ui part with dashboardPageui <- dashboardPage(title = 'This is my Page title', header, sidebar, body, skin="red")

La valeur de titlein dashboardPage()est le titre de la page / onglet du navigateur, tandis que le titre défini dans dashboardHeader()est visible comme titre du tableau de bord.

Création d'un tableau de bord rempli: Serveur

Avec l' interface utilisateur partie terminée, nous allons créer le serveur partie où le programme et derrière la logique valueBoxOutput()et plotOutput()sont ajoutés avec renderValueBox()et renderPlot()respectivement. Ceux-ci sont enfermés à l'intérieur d'un server function, avec inputet output comme paramètres. Les valeurs à l'intérieur inputsont reçues de l' interface utilisateur (comme la textBox valeur, la Slider valeur). Les valeurs à l'intérieur output sont envoyées à l' interface utilisateur (comme plotOutput, valueBoxOutput).

Voici le code serveur complet :

# create the server functions for the dashboard server <- function(input, output) { #some data manipulation to derive the values of KPI boxes total.revenue <- sum(recommendation$Revenue) sales.account % group_by(Account) %>% summarise(value = sum(Revenue)) %>% filter(value==max(value)) prof.prod % group_by(Product) %>% summarise(value = sum(Revenue)) %>% filter(value==max(value))#creating the valueBoxOutput content output$value1 <- renderValueBox({ valueBox( formatC(sales.account$value, format="d", big.mark=',') ,paste('Top Account:',sales.account$Account) ,icon = icon("stats",lib='glyphicon') ,color = "purple") }) output$value2 <- renderValueBox({ valueBox( formatC(total.revenue, format="d", big.mark=',') ,'Total Expected Revenue' ,icon = icon("gbp",lib='glyphicon') ,color = "green") })output$value3 <- renderValueBox({ valueBox( formatC(prof.prod$value, format="d", big.mark=',') ,paste('Top Product:',prof.prod$Product) ,icon = icon("menu-hamburger",lib='glyphicon') ,color = "yellow") })#creating the plotOutput content output$revenuebyPrd <- renderPlot({ ggplot(data = recommendation, aes(x=Product, y=Revenue, fill=factor(Region))) + geom_bar(position = "dodge", stat = "identity") + ylab("Revenue (in Euros)") + xlab("Product") + theme(legend.position="bottom" ,plot.title = element_text(size=15, face="bold")) + ggtitle("Revenue by Product") + labs(fill = "Region") })output$revenuebyRegion <- renderPlot({ ggplot(data = recommendation, aes(x=Account, y=Revenue, fill=factor(Region))) + geom_bar(position = "dodge", stat = "identity") + ylab("Revenue (in Euros)") + xlab("Account") + theme(legend.position="bottom" ,plot.title = element_text(size=15, face="bold")) + ggtitle("Revenue by Region") + labs(fill = "Region") })}

Jusqu'à présent, nous avons défini les deux parties essentielles d'une application Shiny : l' interface utilisateur et le serveur . Enfin, nous devons appeler / exécuter le Shiny ,avec l' interface utilisateur et le serveur comme paramètres.

#run/call the shiny appshinyApp(ui, server)Listening on //127.0.0.1:5101

Le fichier R entier doit être enregistré app.Rdans un dossier avant d' exécuter l'application brillante. N'oubliez pas également de mettre le fichier de données d'entrée (dans notre cas, recommendation.csv)dans le même dossier que app.R. Bien qu'il existe un autre moyen valide de structurer l' application Shiny avec deux fichiers ui.Ret server.R(éventuellement global.R), il a été ignoré dans cet article pour le bien de brièveté puisque cela s'adresse aux débutants.

Lors de l'exécution du fichier, l' application Web Shiny s'ouvrira dans votre navigateur par défaut et ressemblera aux captures d'écran ci-dessous:

Hopefully, at this stage, you have this example Shiny web app up and running. The code and plots used here are available on my Github. If you are interested in Shiny, you can learn more from DataCamp’s Building Web Applications in R with Shiny Course.