studio - ¿Cómo crear TextArea como entrada en una aplicación web Shiny en R?
input r studio (6)
Estoy tratando de crear una aplicación web simple en la que quiera recibir entradas de varias líneas del usuario utilizando el control de área de texto HTML. ¿Hay alguna forma inmediata de crear tal control de entrada en Shiny?
La página de ayuda de TextInput no muestra muchas opciones.
textInput {shiny} R Documentation
Create a text input control
Description
Create an input control for entry of unstructured text values
Usage
textInput(inputId, label, value = "")
Arguments
inputId
Input variable to assign the control''s value to
label
Display label for the control
value
Initial value
Value
A text input control that can be added to a UI definition.
Examples
textInput("caption", "Caption:", "Data Summary")
A partir de la versión 0.14 tiene una implementación de textAreaInput
.
Aprovechando la respuesta de Joe ( https://.com/a/14452837/5776618 ), también puede anidar etiquetas en su propia función para lograr la misma salida que las funciones de entrada incorporadas estándar de Shiny.
textareaInput <- function(id, label, value, rows=20, cols=35, class="form-control"){
tags$div(
class="form-group shiny-input-container",
tags$label(''for''=id,label),
tags$textarea(id=id,class=class,rows=rows,cols=cols,value))
}
Esta es una forma de evitar escribir el código JS (si lo desea) mientras todavía ...
- tener una función que llame de la misma manera que las entradas incorporadas de Shiny se llaman, y
- incluye el estilo CSS de control de forma div, label y Bootstrap (de modo que se parece a los controles de entrada Shiny incorporados)
El uso de la función es igual que si estuviera usando el incorporado o si creó una IU personalizada.
textareaInput("textareaID","Text Area Label", "Insert text here...", rows = 20, cols = 35)
Aquí hay una solución rápida que conserva la sensación de entrada brillante, pero permite un número personalizado de columnas:
textareaInput <- function(inputID, label, value="", rows=10, columns=80) {
HTML(paste0(''<div class="form-group shiny-input-container">
<label for="'', inputID, ''">'', label,''</label>
<textarea id="'', inputID, ''" rows="'', rows,''" cols="'',
columns,''">'', value, ''</textarea></div>''))
}
En su script ui.R
, puede agregar:
textareaInput("shazam", "My text box")
Nota: para obtener una sensación de Bootstrap en el área de texto, puede utilizar:
textareaInput <- function(inputID, label, value="", rows=10) {
HTML(paste0(''<div class="form-group shiny-input-container">
<label for="'', inputID, ''">'', label,''</label>
<textarea class="form-control" id="'', inputID,
''" rows="'', rows, ''">'', value, ''</textarea></div>''))
}
Para beneficio de otros, publicaré cómo resolví el problema usando el control personalizado de la interfaz de usuario siguiendo el tutorial de Shiny
En primer lugar, he creado el archivo textarea.js de la siguiente manera
$(document).on("click", "textarea.inputTextarea", function(evt) {
// evt.target is the button that was clicked
var el = $(evt.target);
// Raise an event to signal that the value changed
el.trigger("change");
});
var inputTextareaBinding = new Shiny.InputBinding();
$.extend(inputTextareaBinding, {
find: function(scope) {
return $(scope).find(".inputTextarea");
},
getValue: function(el) {
return $(el).text();
},
setValue: function(el, value) {
$(el).text(value);
},
subscribe: function(el, callback) {
$(el).on("change.inputTextareaBinding", function(e) {
callback();
});
},
unsubscribe: function(el) {
$(el).off(".inputTextareaBinding");
}
});
Shiny.inputBindings.register(inputTextareaBinding);
Luego agregué la siguiente función en ui.R de shiny webapp antes de llamar a shinyUI ()
inputTextarea <- function(inputId, value="", nrows, ncols) {
tagList(
singleton(tags$head(tags$script(src = "textarea.js"))),
tags$textarea(id = inputId,
class = "inputtextarea",
rows = nrows,
cols = ncols,
as.character(value))
)
}
Luego utilicé la función definida anteriormente para crear el elemento de control de área de texto deseado en ui.R
shinyUI(pageWithSidebar(
# Application title
headerPanel("Test Header Panel"),
sidebarPanel(),
mainPanel(
inputTextarea(''exampleTextarea'', '''',20,35 )
)
))
Puede agregar un área de texto usando tags
y Shiny debe recogerlo automáticamente:
tags$textarea(id="foo", rows=3, cols=40, "Default value")
O si te sientes más cómodo con HTML directo, también puedes hacerlo.
HTML(''<textarea id="foo" rows="3" cols="40">Default value</textarea>'')
En cualquier caso, la input$foo
debe reflejar el valor del área de texto.
Puede o no ser relevante aquí, pero hice el paquete shinyAce para envolver y exponer el editor de texto Ace en Shiny. Ace se utiliza principalmente para la edición de código (completo con resaltado de sintaxis para una variedad de idiomas), pero proporciona una interfaz similar a un área de texto para escribir texto / código de varias líneas.
Puedes ver el ejemplo para ver si eso es lo que estás buscando. (Pruebe diferentes "modos" para resaltar la sintaxis y temas para combinaciones de colores).