Shiny, ejemplo 1
Karen Calva
27 de junio de 2019
ui.R
library(shinythemes)
shinyUI(fluidPage(# para tener sola una hoja
theme=shinytheme("cerulean"),
#titulo principal de la aplicación
titlePanel("La primera aplicacion Shiny de Karen"),
#sección de la aplicación
sidebarLayout(#position = "right", #para que el panel lateral sea derecho
sidebarPanel( "TÃtulo en el panel lateral izquierdo",
br(),br(), # sirve para dar lineas de salto
"el clima en Quito últimamente es cálido",
hr(),
strong("FRASE"),# NEGRITAS
br(),
em("Puedes, deberÃas, y si eres lo suficientemente valiente para empezar, lo harás."), # CURSIVA
br(),
span("Stephen King", style = "color:coral"),# COLOREAR TEXTO
hr(),
img(src="8.jpg", align = 'center', height = 200, width = 200),
hr(),
a("www.karen.com"),
hr(),
code( 2+2/1), # para que se imprima como codigo
hr(),
pre("There's a fire starting in my heart
Reaching a fever pitch, and it's bringing me out the dark
Finally, I can see you crystal clear
Go ahead and sell me out, and I'll lay your ship bare
See how I'll leave with every piece of you
Don't underestimate the things that I will do
There's a fire starting in my heart
Reaching a fever pitch, and it's bringing me out the dark
The scars of your love remind me of us
They keep me thinking that we almost had it all
The scars of your love, they leave me breathless
I can't help feeling
We could have had it all
(You're gonna wish you never had met me)
Rolling in the deep
(Tears are gonna fall, rolling in the deep)
You had my heart inside of your hand
(You're gonna wish you never had met me)
And you played it to the beat
(Tears are gonna fall, rolling in the deep)")
),
mainPanel("TÃtulo en el panel principal: CONTENIDO HTML",
# los h sirven para escribir titulos
h1("TÃtulo de segundo nivel"), # el titulo mas grande de shiny
h2("TÃtulo de tercer nivel"),
h3("TÃtulo de cuarto nivel"),
h4("TÃtulo de quinto nivel"),
h5("TÃtulo de sexto nivel"),
h6("TÃtulo de septimo nivel"), # el titulo mas pequeño de shiny
"Si George Lucas tenÃa una primera aplicación, podrÃa ser asÃ:",
h6 ("Episodio IV", align = "center"),
h6 ("UNA NUEVA ESPERANZA", align = "center"),
h5 ("Nos encontramos en un periodo de guerra civil.", align = "center"),
h4 ("Las naves espaciales rebeldes, atacando", align = "center"),
h3 ("desde una base oculta, han ganado", align = "center"),
h2 ("su primera victoria contra el malvado", align = "center"),
h1 (" Imperio Galáctico." ,align = "left"),
p("p(): Un párrafo de texto"),
a("a(): Un hyper link"),
br(),
"br(): Una salto de lÃnea",
hr(),
"hr(): lÃnea de división",
hr(),
"div(): División de texto con estilo uniforme:",
div("Star Wars Episodio IV: Una Nueva Esperanza, originalmente lanzada como Star Wars,
es una pelÃcula de ciencia ficción y fantasÃa de 1977 escrita y dirigida por George Lucas.
Innovadora en el uso de efectos especiales, esta entre las pelÃculas mas exitosas de todos los tiempos
y es considerada generalmente como una de las mas influyentes también.
Fue seleccionada para ser preservada en la Biblioteca del Congreso como parte del National Film Registry
en 1989, el primer año de existencia del programa."),
br(),
"pre(): Texto tal como esta en una fuente original",
br(),
pre("Star Wars Episodio IV: Una Nueva Esperanza,
originalmente lanzada como Star Wars, es una pelÃcula de ciencia ficción
y fantasÃa de 1977 escrita y dirigida por George Lucas.
Innovadora en el uso de efectos especiales,
esta entre las pelÃculas mas exitosas de todos los tiempos
y es considerada generalmente como una de las mas influyentes también.
Fue seleccionada para ser preservada en la Biblioteca del Congreso
como parte del National Film Registry en 1989, el primer año de existencia
del programa."),
br(),
"code(): Un bloque con formato de código",
br(),
code("x <- faithful[, 2] # datos del géiser Old Faithful"),
br(),
code("cubos <- seq(min(x), max(x), length.out = input$cubos + 1)"),
br(),
code("hist(x, breaks = cubos, col = 'darkgray', border = 'white' # dibujar un histograma"),
br(),
br(),
"img(): insertar una imágen",
br(),
br(),
code("img(src='see.jpg', align = 'left', height = 50, width = 80)"),
hr(),
img(src="see.jpg", align = "center", height = 50, width = 80),
hr(),
img(src="see.jpg", align = "center"),
hr(),
br(),
strong("Texto en negrita"),
br(),
em("Texto en cursiva"),
br(),
"para darle color al texto: span('texto',style='color:blue')",
br(),
span("RStudio", style = "color:blue"),
h2("Resumen"),
"Con sus nuevas habilidades, usted puede:",
hr(),
p("* Crear una interfaz de usuario con fluidPage, titlePanel y sidebarLayout"),
p("* Crear un elemento HTML con una de las funciones de la etiqueta de Shiny"),
p("* Establecer atributos de etiquetas HTML en los argumentos de cada función de etiqueta"),
p("* Agregue un elemento a su página web pasándolo a titlePanel, sidebarPanel o mainPanel"),
p("* Agregue varios elementos a cada panel separándolos con una coma"),
p("* Agregue imágenes colocando su imagen en una carpeta etiquetada www dentro de su directorio de aplicación brillante y luego llamando a la función img"),
hr(),
h2("Añadir widgets de control"),
p("Como agregar widgets de control a sus aplicaciones Shiny."),
span("¿Qué es un widget? Un elemento web con el que los usuarios pueden interactuar.",style = "color:red"),
p("Los widgets proporcionan una manera para que tus usuarios envÃen mensajes a la aplicación brillante."),
p("Los widgets brillantes recogen un valor de su usuario.
Cuando un usuario cambia el widget, el valor también cambiará."),
h3("Widgets de control"),
hr(),
strong("actionButton")," Botón de acción",br(),
strong("checkboxGroupInput")," Un grupo de casillas de verificación",br(),
strong("checkboxInput"), " Una sola casilla de verificación",br(),
strong("dateInput"), "Un calendario para ayudar a la selección de fecha",br(),
strong("dateRangeInput")," Un par de calendarios para seleccionar un intervalo de fechas",br(),
strong("FileInput")," Un asistente de control de carga de archivos",br(),
strong("HelpText"), " Texto de ayuda que se puede agregar a un formulario de entrada",br(),
strong("NumericInput")," Campo para ingresar números",br(),
strong("RadioButtons")," Un conjunto de botones de radio",br(),
strong("SelectInput")," Una casilla con opciones para seleccionar",br(),
strong("SliderInput")," Una barra deslizante",br(),
strong("SubmitButton")," Un botón de envÃo",br(),
strong("TextInput")," Un campo para introducir texto",br(),
hr(),
fluidRow(
# el 3 es el numero de filas a ocupar
column(3,# es para imprimir varios resultados u objetos en una sola fila
h3("Botones"),
actionButton("accion", label = "Acción"),
br(),
br(),
submitButton("Enviar")),
column(3,
h3("Casilla de verificación única"),
checkboxInput("casilla", label = "Opción A", value = TRUE)),
column(3,
checkboxGroupInput("casillas",
label = h3("Casillas de verificación:"),
choices = list("Opción 1" = 1,
"Opción 2" = 2, "Opción 3" = 3),
selected = 1)),
column(3,
dateInput("fecha",
label = h3("Ingresar Fecha:"),
value = "2017-01-01"))
),
fluidRow(
column(3,
dateRangeInput("Fechas", label = h3("Rango de fechas:"))),
column(3,
fileInput("Archivo", label = h3("Ingresar archivo:"))),
column(3,
h3("Texto de ayuda"),
helpText("Nota: La ayuda de texto no es dinámica,",
"pero es una forma fácil de añadir texto",
"que facilite el us de los otros widgets.")),
column(3,
numericInput("numero",
label = h3("Ingrese número"),
value = 1))
),
fluidRow(
column(3,
radioButtons("radio", label = h3("Botones de radio"),
choices = list("Opción 1" = 1, "Opción 2" = 2,
"Opción 3" = 3),selected = 3)),
column(3,
selectInput("select", label = h3("Seleccione:"),
choices = list("Opción 1" = 1, "Opción 2" = 2,
"Opción 3" = 3), selected = 1)),
column(3,
sliderInput("slider", label = h3("Sliders:"),
min = 0, max = 100, value = 50),
sliderInput("slider2", "",
min = 0, max = 100, value = c(25, 75))
),
column(3,
textInput("texto", label = h3("Ingrese texto:"),
value = "AquÃ..."))
),
h2("Visualización de los resultados"),
p("Es hora de darle a su aplicación Shiny la calidad 'en vivo'! Crearemos resultados reactivos para mostrarlos en la aplicación Shiny."),
p("La salida reactiva responde automáticamente cuando el usuario cambia un widget."),
h3("Dos pasos"),
"Puede crear una salida reactiva con un proceso de dos pasos.",
br(),
br(),
p("* Agregue un objeto R a su interfaz de usuario con ui.R."),
p("* DÃgale a Shiny cómo construir el objeto en server.R. El objeto será reactivo si el código que lo construye llama un valor de widget."),
hr(),
h2("Paso 1:"), "Agregar un objeto R a la interfaz de usuario.",
p("Shiny proporciona una familia de funciones que convierten objetos R en salida para su interfaz de usuario. Cada función crea un tipo especÃfico de salida."),
br(),
strong("htmlOutput")," HTML bruto",br(),
strong("imageOutput")," imagen",br(),
strong("plotOutput"), "resultado gráfico de salida",br(),
strong("tableOutput")," Tabla",br(),
strong("textOutput")," texto",br(),
p("Coloque la función de salida dentro de sidebarPanel o mainPanel en el script ui.R."),
hr(),
h3("Ejemplos:"),
helpText("Crearemos un mapa demográfico con información
del censo del 2010"),
selectInput("var",
label = "Escoja una variable para mostrar",
choices = c("Porcentaje A", "Porcentaje B",
"Porcentaje C", "Porcentaje D"),
selected = "Porcentaje A"),
sliderInput("range",
label = "Rango de interés:",
min = 0, max = 100, value = c(0, 10)),
h2("Paso 2: Proporcione el código R para construir el objeto."),
p("Colocar una función en ui.R le indica a Shiny dónde mostrar su objeto. A continuación, debe indicar a Shiny cómo crear el objeto."),
p("Haga esto proporcionando el código de R que construye el objeto en server.R. El código debe ir en su script server.R."),
p("Construimos un objeto de tipo lista denominado output que contiene todo el código necesario para actualizar los objetos R en su aplicación.
Cada objeto R debe tener su propia entrada en la lista."),
p("El nombre del elemento en el server debe coincidir con el nombre del elemento reactivo que creó en ui.R."),
p("En el script siguiente, output$text1 coincide con textOutput('text1') en su script ui.R."),
hr(),
code("shinyServer(function(input, output) {"),br(),
code(" output$text1 <- renderText({ "),br(),
code(" 'Usted ha seleccionado esto:'"),br(),
code(" })"),br(),
code("})"),br(),
hr(),
strong("renderImage")," Imágenes (guardadas en la carpeta seteada.)",br(),
strong("renderPlot")," procesos para constrir gráficos.",br(),
strong("renderPrint")," cualquier salida impresa",br(),
strong("renderTable")," tabla de datos, matriz, otras estructuras",br(),
strong("rendertext")," cadenas de texto",br(),
h2("Usar valores de widget:"),
hr(),
selectInput("datos", "Escoja un conjunto de datos:",
choices = c("rocas", "presión", "carros")), # lee opcion seleccionada en el ui para usarla en el server
numericInput("obs", "Numero de obbservaciones a mostrar", 10), # lee numero en el ui para usarlo en el server
verbatimTextOutput("summary"),# imprime resultados del server
tableOutput("tabla")
))
))server.R
library(shiny)
library(datasets)
shinyServer(function(input, output) { # fija
output$text1 <- renderText({
"Usted ha seleccionado esto:"
})
########################################################
datos <- reactive({ # no imprime resultados, solo fija el objeto o la base
switch(input$datos,
"rocas" = datasets::rock,
"presión" = datasets::pressure,
"carros" =datasets:: cars)
})
# generamos un summary de los datos
output$summary <- renderPrint({ # imprimir resultados de una funcion de R
dataset <- datos()
summary(dataset)
})
# mostrar las primeras "n" observaciones
output$tabla <- renderTable({ # output$ para los objetos que se imprimen ui
head(datos(), n = input$obs) # input$ para los objetos que se leen desde ui
})
})Crear una carpeta en el directorio de trabajo y guardar ahà las siguientes imágenes
