# autor -------------------------------------------------------------------
# carlos.perez7@udea.edu.co
# 11/03/2019 22:37:08 p. m.
#
tabItem(tabName="coordPar_densidad-2DTab",
h3(id="mediasHiperTitle", "An\u00E1lisis Descriptivo usando las medias de las Hipercartas [Datos de Julio a Diciembre de 2018]."),
bsPopover(id="mediasHiperTitle", title="Base de Datos", placement="bottom", trigger="hover",
content="HIPERCARTAS_JUL-DIC-2018_144<br/>R.obj=hiperCartaData"),
navbarPage(tags$b("Descriptivo-2D"),
tabPanel("Patrones", icon = icon("gg"),
helpText(paste("Brushing: clic y arrastar sobre un eje (un clic para restaurar). Ordenar: doble clic sobre una variable.",
"Intercambiar: clic sobre una variable y arrastrar hacia los lados.")),
# El atributo "with" del box(..) usa el valor entero 1->12 columnas (12->100%).
box(title="Coordenadas Paralelas - Hipercartas", status="success", solidHeader=TRUE, collapsible=TRUE, width=12,
parcoordsOutput("paralCoordsPlot", height="500px", width="100%" ) %>% withSpinner(type=5, color="cadetblue") %>%
helper(type = "markdown", title = "HIPERVIZ-R: Coordenadas Paralelas", colour = "red",
content = "paralelasMediasPlot_help", size = "m") # size: define el ancho (s,m,l) del "popup"
)
),
navbarMenu("Distribuci\u00F3n",
tabPanel("Box Plot", icon = icon("cube"),
helpText("An\u00E1lisis por medio del esquema Box-Plot. Se usa una media a la vez debido a la diferencia entre escalas."),
bsPopover(id="boxplotDensidadPlot", title="Box-Plot", placement = "top", trigger = "hover",
content="Se presentan: los valores, la media y la desviaci\u00F3n est\u00E1ndar punteadas."),
dropdownButton(inputId = "boxplotMedidaOpsBtn",
tags$h4("Opciones de Presentaci\u00F3n:"),
selectInput("boxplotMediaHiper", label = "Hipercarta", width="220px", # Para ajutar el ancho del Select!
choices=c("Conductividad"="MEDIA_Condu", "pH"="MEDIA_ph",
"Oxig. Disuelto"="MEDIA_od", "Turbiedad"="MEDIA_turb",
"Pot. Redox"="MEDIA_pot_redox", "Temperatura"="MEDIA_tempera"),
selected="MEDIA_Condu"),
awesomeCheckbox(inputId = "boxplotMediaPuntosCheck",
label = "Ver Puntos de Media", value = FALSE, status = "success"),
tags$i("Actualizaci\u00F3n autom\u00E1tica..."),
circle = TRUE, status = "danger", icon = icon("gear"), width = "250px",
size = "xs", tooltip = tooltipOptions(title = "Cambiar opciones...")
),
plotlyOutput("boxplotDensidadPlot", width = "100%", height = "500px") %>% withSpinner(type=5, color="cadetblue")
),
tabPanel("Distribuci\u00F3n de Densidad", icon = shiny::icon("stats", lib = "glyphicon"),
helpText("Distribuci\u00F3n de Densidad para las medias (suavizado).Se usa una media a la vez debido a la diferencia entre escalas."),
dropdownButton(inputId = "densidadMedidaOpsBtn",
tags$h4("Opciones de Presentaci\u00F3n:"),
selectInput("densidadMediaHiper", label = "Hipercarta", width="220px", # Para ajutar el ancho del Select!
choices=c("Conductividad"="MEDIA_Condu", "pH"="MEDIA_ph",
"Oxig. Disuelto"="MEDIA_od", "Turbiedad"="MEDIA_turb",
"Pot. Redox"="MEDIA_pot_redox", "Temperatura"="MEDIA_tempera"),
selected="MEDIA_Condu"),
tags$i("Actualizaci\u00F3n autom\u00E1tica..."),
circle = TRUE, status = "danger", icon = icon("gear"), width = "250px",
size = "xs", tooltip = tooltipOptions(title = "Cambiar opciones...")
),
plotlyOutput("distribucionDensidadPlot", width = "100%", height = "500px") %>% withSpinner(type=4, color="cadetblue")
),
tabPanel("Dispersi\u00F3n - Regresi\u00F3n", icon = icon("random"),
helpText("Dispersi\u00F3n - Regresi\u00F3n para las medias (suavizado).Se usa una media a la vez debido a la diferencia entre escalas."),
dropdownButton(inputId = "disperRegreMedidaOpsBtn",
tags$h4("Opciones de Presentaci\u00F3n:"),
selectInput("disperRegreMediaHiper", label = "Hipercarta", width="220px", # Para ajutar el ancho del Select!
choices=c("Conductividad"="MEDIA_Condu", "pH"="MEDIA_ph",
"Oxig. Disuelto"="MEDIA_od", "Turbiedad"="MEDIA_turb",
"Pot. Redox"="MEDIA_pot_redox", "Temperatura"="MEDIA_tempera"),
selected="MEDIA_Condu"),
tags$i("Actualizaci\u00F3n autom\u00E1tica..."),
circle = TRUE, status = "danger", icon = icon("gear"), width = "250px",
size = "xs", tooltip = tooltipOptions(title = "Cambiar opciones...")
),
plotlyOutput("disperRegrePlot", width = "100%", height = "500px") %>% withSpinner(type=5, color="cadetblue")
),
tabPanel("Viol\u00EDn", icon = icon("music", lib = "glyphicon"),
helpText("An\u00E1lisis por medio del esquema Viol\u00EDn. Se usa una media a la vez debido a la diferencia entre escalas."),
bsPopover(id="violinDensidadPlot", title="Viol\u00EDn-Plot", placement = "top", trigger = "hover",
content="Se presenta: Un Box-Plot enmarcado con una distribuci\u00F3n de densidad suavizada (Kernel Density)."),
dropdownButton(inputId = "violinMedidaOpsBtn",
tags$h4("Opciones de Presentaci\u00F3n:"),
selectInput("violinMediaHiper", label = "Hipercarta", width="220px", # Para ajutar el ancho del Select!
choices=c("Conductividad"="MEDIA_Condu", "pH"="MEDIA_ph",
"Oxig. Disuelto"="MEDIA_od", "Turbiedad"="MEDIA_turb",
"Pot. Redox"="MEDIA_pot_redox", "Temperatura"="MEDIA_tempera"),
selected="MEDIA_Condu"),
tags$i("Actualizaci\u00F3n autom\u00E1tica..."),
circle = TRUE, status = "danger", icon = icon("gear"), width = "250px",
size = "xs", tooltip = tooltipOptions(title = "Cambiar opciones...")
),
plotlyOutput("violinDensidadPlot", width = "100%", height = "500px") %>% withSpinner(type=5, color="cadetblue")
)
),
tabPanel("Contornos", icon = icon("paperclip"),
helpText("An\u00E1lisis por medio de contornos (Densidad 2D)."),
dropdownButton(inputId = "contornoMedidaOpsBtn",
tags$h4("Opciones de Presentaci\u00F3n:"),
# Nota: En el listado de choices se usa una lista c("label"="id_txt"). En el server el input entrega el "id_txt".
selectInput("contornoEjeXHipercarta", label = "Hipercarta eje X", width="220px", # Para ajutar el ancho del Select!
choices=c("t sub-j"="id_t", "Conductividad"="MEDIA_Condu", "pH"="MEDIA_ph",
"Oxig. Disuelto"="MEDIA_od", "Turbiedad"="MEDIA_turb",
"Pot. Redox"="MEDIA_pot_redox", "Temperatura"="MEDIA_tempera"),
selected="id_t"),
selectInput("contornoEjeYHipercarta", label = "Hipercarta eje Y", width="220px", # Para ajutar el ancho del Select!
choices=c("Conductividad"="MEDIA_Condu", "pH"="MEDIA_ph",
"Oxig. Disuelto"="MEDIA_od", "Turbiedad"="MEDIA_turb",
"Pot. Redox"="MEDIA_pot_redox", "Temperatura"="MEDIA_tempera"),
selected="MEDIA_Condu"),
selectInput(inputId='contornoMedidaMethod', label='Estilo de Representaci\u00F3n',
choices=c("Poligono", "Contorno", "Espectral"), selected = "Espectral"),
awesomeCheckbox(inputId = "contornoMedidaPuntosCheck",
label = "Ver Puntos de Media", value = FALSE, status = "success"),
tags$i("Actualizaci\u00F3n autom\u00E1tica..."),
circle = TRUE, status = "danger", icon = icon("gear"), width = "250px",
size = "xs", tooltip = tooltipOptions(title = "Cambiar opciones...")
),
plotlyOutput("contornosDensidadPlot", width = "100%", height = "500px") %>% withSpinner(type=4, color="cadetblue")
),
navbarMenu("Correlaci\u00F3n",
tabPanel("Correlograma", icon = icon("th-large"),
helpText("An\u00E1lisis por medio de Correlograma."),
dropdownButton(inputId = "correlogramaOpsBtn",
tags$h4("Opciones de Presentaci\u00F3n:"),
selectInput(inputId = 'correlogramaMethod', label = 'Estilo de Representaci\u00F3n',
choices = c("C\u00EDrculo"="circle","Cuadrado"="square",
"Elipse"="ellipse","Num\u00E9rico"="number","Torta"="pie"),
selected = "circle"),
selectInput(inputId = 'correlogramaSection', label = 'Ver Secci\u00F3n',
choices = c("Completo"="full","Inferior"="lower","Superior"="upper"), selected = "upper"),
awesomeCheckbox(inputId = "correlogramaCoefCheck",
label = "Ver Coeficientes", value = FALSE, status = "success"),
tags$i("Actualizaci\u00F3n autom\u00E1tica..."),
circle = TRUE, status = "danger", icon = icon("gear"), width = "250px",
size = "xs", tooltip = tooltipOptions(title = "Cambiar opciones...")
),
# IMPORTANTE: corrplot genera un grafico estandar para el cual plotly no tiene WRAPPER...
plotOutput("correlogramaPlotOut", width = "100%", height = "500") %>% withSpinner(type=5, color="cadetblue")
),
tabPanel("Red de Correlaci\u00F3n",icon = icon("connectdevelop"),
helpText("Red de Correlaci\u00F3n (an\u00E1lisis exploratorio/confirmatorio para las medias)."),
helpText("Cnd: Conductividad, PH: PH, OxD: Ox\u00EDgeno Disuelto, Tur: Turbiedad, P_R: Potencial Redox, Tmp: Temperatura"),
dropdownButton(inputId = "corrnetOpsBtn",
tags$h4("Opciones de Presentaci\u00F3n:"),
selectInput(inputId = 'corrnetLayout', label = 'Estilo de Representaci\u00F3n',
choices = c("C\u00EDrculo"="circle","Grupos"="groups","Tipo Spring"="spring"), selected = "spring"),
selectInput(inputId = 'corrnetGraph', label = 'M\u00E9todo de Optimizaci\u00F3n',
choices = c("Ninguno"="Ninguno","Asociaci\u00F3n"="assosciation",
"Concentraci\u00F3n"="concentration","Tipo Graphical LASSO"="glasso"), selected = "Ninguno"),
tags$i("Actualizaci\u00F3n autom\u00E1tica..."),
circle = TRUE, status = "danger", icon = icon("gear"), width = "250px",
size = "xs", tooltip = tooltipOptions(title = "Cambiar opciones...")
),
plotOutput("corrnetPlotOut", width = "600", height = "600") %>%
withSpinner(type=4, color="cadetblue") %>%
helper(type = "markdown", title = "HIPERVIZ-R: Red de Correlaci\u00F3n", colour = "red",
content = "redCorrelacionPlot_help", size = "m") # size: define el ancho (s,m,l) del "popup"
),
tabPanel("Diagrama de Cuerdas", icon = icon("life-ring"),
h4("Diagrama de Cuerdas (visi\u00F3n circular de la correlaciones entre los par\u00E1metros)."),
bsPopover(id="cuerdasCorrPlotOut", title="Diagrama de Cuerdas", placement = "top", trigger = "hover",
content="El color rojo/verde indica una correlaci\u00F3n negativa/positiva y el ancho de la cuerda representa su magnitud."),
plotOutput("cuerdasCorrPlotOut", width = "700", height = "700") %>% withSpinner(type=5, color="cadetblue"),
helpText("[El color rojo/verde y el ancho de la cuerda indican una correlaci\u00F3n negativa/positiva y su magnitud].")
),
tabPanel("Matriz de Dispersi\u00F3n",icon = icon("th"), h4("Matriz de Dispersi\u00F3n (Scatter Plot Matrix - SPLOM)"),
bsPopover(id="splomCorrPlotOut", title="Matriz de Dispersi\u00F3n (SPLOM)", placement = "top", trigger = "hover",
content="Se presentan los diagramas de dispersi\u00F3n, gr\u00E1fico de densidad y valor de la correlaci\u00F3n entre par\u00E1metros."),
plotlyOutput("splomCorrPlotOut", width = "100%", height = "800") %>% withSpinner(type=4, color="cadetblue"),
helpText("[La diagonal principal presenta la distribuci\u00F3n de desidad de cada par\u00E1metro].")
),
tabPanel("Barras",icon = icon("signal"), h4("Barras"),
dropdownButton(inputId = "barrasCorrOpsBtn",
tags$h4("Opciones de Presentaci\u00F3n:"),
materialSwitch(inputId = "barrasCorrSortCheck", label = "Ordenar Valores",
value = FALSE, status = "info", right = TRUE),
materialSwitch(inputId = "barrasCorrHorizCheck", label = "Vista Horizontal",
value = FALSE, status = "success", right = TRUE),
materialSwitch(inputId = "barrasCorrStackCheck", label = "Apilar Barras",
value = FALSE, status = "primary", right = TRUE),
tags$i("Actualizaci\u00F3n autom\u00E1tica..."),
circle = TRUE, status = "danger", icon = icon("gear"), width = "250px",
size = "xs", tooltip = tooltipOptions(title = "Cambiar opciones...")
),
amChartsOutput("barrasCorrPlotOut", width = "100%", height = "700") %>% withSpinner(type=5, color="cadetblue")
)
)
) # FIN navbarPage
)
#
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.