关键词:
【中文标题】在闪亮的 R 中自动调整 textAreaInput 的大小【英文标题】:auto-resize textAreaInput in shiny R 【发布时间】:2021-05-31 01:15:22 【问题描述】:我正在尝试调整 this SO answer 关于如何通过 javascript 为闪亮 R 自动调整 textarea 输入的大小。理想情况下,我想避免使用 ShinyJS 等帮助程序包。
首先我尝试了一个纯 javascript 实现,在该实现中我将 javascript 按原样加载到应用程序中(方法 1)。然后我尝试从闪亮的observeEvent触发javascript函数(方法2)。
这两种方法都不起作用。 好像我错过了什么。
方法一:
library(shiny)
jsCode1 <- "
var observe;
if (window.attachEvent)
observe = function (element, event, handler)
element.attachEvent('on'+event, handler);
;
else
observe = function (element, event, handler)
element.addEventListener(event, handler, false);
;
function init ()
var text = document.getElementById('text');
function resize ()
text.style.height = 'auto';
text.style.height = text.scrollHeight+'px';
/* 0-timeout to get the already changed text */
function delayedResize ()
window.setTimeout(resize, 0);
observe(text, 'change', resize);
observe(text, 'cut', delayedResize);
observe(text, 'paste', delayedResize);
observe(text, 'drop', delayedResize);
observe(text, 'keydown', delayedResize);
text.focus();
text.select();
resize();
init();
"
shinyApp(ui =
fluidPage(
tags$script(jsCode1),
tags$head(
tags$style("
textarea
border: 0 none white;
overflow: hidden;
padding: 0;
outline: none;
background-color: #D0D0D0;
"
)
),
shiny::tagAppendAttributes(
textAreaInput(inputId = "text",
label = "Enter text here",
placeholder = "insert your text here",
width = "100%"),
style = "width: 100%;")
),
server = function(input, output, session)
)
方法2:
library(shiny)
jsCode2 <- "
Shiny.addCustomMessageHandler('handler1', init);
function init (el)
var text = document.getElementById(el);
function resize ()
text.style.height = 'auto';
text.style.height = text.scrollHeight+'px';
/* 0-timeout to get the already changed text */
function delayedResize ()
window.setTimeout(resize, 0);
observe(text, 'change', resize);
observe(text, 'cut', delayedResize);
observe(text, 'paste', delayedResize);
observe(text, 'drop', delayedResize);
observe(text, 'keydown', delayedResize);
text.focus();
text.select();
resize();
"
shinyApp(ui =
fluidPage(
tags$script(jsCode2),
tags$head(
tags$style("
textarea
border: 0 none white;
overflow: hidden;
padding: 0;
outline: none;
background-color: #D0D0D0;
"
)
),
shiny::tagAppendAttributes(
textAreaInput(inputId = "text",
label = "Enter text here",
placeholder = "insert your text here",
width = "100%"),
style = "width: 100%;")
),
server = function(input, output, session)
observeEvent(input$text,
session$sendCustomMessage("handler1", message = "text")
)
)
【问题讨论】:
【参考方案1】:可能是您尝试在 textinput()
添加到 DOM 之前将调整大小事件附加到后者。
我添加了一个事件侦听器,该侦听器在附加调整大小事件之前等待 DOM 加载完毕。
document.addEventListener('DOMContentLoaded', function(event) ...)
shinyjs
会自动为您执行此操作。添加上面的事件监听器,你可以不使用shinyjs
让它工作。
Javascript 代码:
jsCode <- "document.addEventListener('DOMContentLoaded', function(event)
var observe;
if (window.attachEvent)
observe = function (element, event, handler)
element.attachEvent('on'+event, handler);
;
else
observe = function (element, event, handler)
element.addEventListener(event, handler, false);
;
function init ()
var text = document.getElementById('text');
function resize ()
text.style.height = 'auto';
text.style.height = text.scrollHeight+'px';
/* 0-timeout to get the already changed text */
function delayedResize ()
window.setTimeout(resize, 0);
observe(text, 'change', resize);
observe(text, 'cut', delayedResize);
observe(text, 'paste', delayedResize);
observe(text, 'drop', delayedResize);
observe(text, 'keydown', delayedResize);
text.focus();
text.select();
resize();
;init()
)
"
应用程序:
library(shiny)
ui <- fluidPage(
shiny::tags$script(jsCode),
textAreaInput(inputId = "text", label = "a", value = "b")
)
server <- function(input, output, session)
shinyApp(ui, server)
【讨论】:
像魅力一样工作!调整操作按钮的大小会导致闪亮仪表板中的标题错位
】调整操作按钮的大小会导致闪亮仪表板中的标题错位【英文标题】:resizinganactionbuttoncausesmisalignmentintheheaderinshinydashboard【发布时间】:2021-10-2621:35:27【问题描述】:我在闪亮仪表板的标题上放置了一个操作按钮,它会自动打... 查看详情
如何在 R 闪亮的字符串中插入新行
】如何在R闪亮的字符串中插入新行【英文标题】:howtoinsertnewlineinRshinystring【发布时间】:2014-12-0916:23:07【问题描述】:在闪亮中,我有以下几点:output$sequenceText<-renderText(showSequence())showSequence<-reactive(selectedSeqs<-as.numeric(i... 查看详情
在带有 R 闪亮的 selectizeInput 中使用 html
】在带有R闪亮的selectizeInput中使用html【英文标题】:usehtmlinselectizeInputwithRshiny【发布时间】:2021-06-2706:59:23【问题描述】:我想在select(ize)Input的选项中使用一些html。有谁知道如何告诉闪亮将选项视为HTML的简单解决方案?library(... 查看详情
如何在 R 闪亮中使用 plotly
】如何在R闪亮中使用plotly【英文标题】:HowtouseplotlyinRshiny【发布时间】:2020-06-0306:00:42【问题描述】:我正在尝试为我使用闪亮生成的输出添加图表。我在生成图形时遇到错误。有人可以看看并提供帮助。条形图参数是计算生... 查看详情
在闪亮的应用程序中调整嵌入图像的大小
】在闪亮的应用程序中调整嵌入图像的大小【英文标题】:ResizeEmbeddingImageinShinyApp【发布时间】:2018-10-2505:02:06【问题描述】:参考Kayhttps://***.com/a/21998722/9373320在此提供的答案,我想将插入的图像尺寸减小到高度和宽度的50%。ma... 查看详情
在 R 闪亮的应用程序中接受 HTTP 请求
】在R闪亮的应用程序中接受HTTP请求【英文标题】:AcceptHTTPRequestinRshinyapplication【发布时间】:2014-10-0711:33:22【问题描述】:我制作了一个闪亮的应用程序,它需要从另一台服务器获取其数据,即当闪亮的应用程序打开时,另一... 查看详情
在r闪亮中更改下载情节的尺寸
】在r闪亮中更改下载情节的尺寸【英文标题】:ChangingDimensionsofdownloadedplotofplotlyinrshiny【发布时间】:2021-10-0604:29:53【问题描述】:我有一个代码,它每次都下载以相同尺寸形成的图形的png图像。我想在其中生成质量更高的图像... 查看详情
通过闪亮的包R在浏览器中显示符号
】通过闪亮的包R在浏览器中显示符号【英文标题】:DisplaysymbolsinbrowserviashinypackageR【发布时间】:2014-01-0714:36:03【问题描述】:我的闪亮应用中有以下数字输入:numericInput(inputId="beta",label="beta:",value=0.05,step=0.01),是否可以在网络... 查看详情
删除后如何将旧的反应输入存储在R闪亮中
】删除后如何将旧的反应输入存储在R闪亮中【英文标题】:HowtostoreanoldreactiveinputinRshinyafterremovingit【发布时间】:2019-12-1900:18:17【问题描述】:我有以下r闪亮的应用程序。我们先导入库library(shiny)现在我们生成UIui<-fluidPage(down... 查看详情
链接dataTableOutput和R中闪亮的绘图
】链接dataTableOutput和R中闪亮的绘图【英文标题】:LinkingdataTableOutputandplotinShinyinR【发布时间】:2021-12-2422:47:09【问题描述】:我想在闪亮的应用程序中链接dataTableOutput和绘图,以便在表格中选择行或单元格时,绘图将使用与该... 查看详情
R闪亮:填写提示用户并支持自动填充功能的表单时不需要的反应
】R闪亮:填写提示用户并支持自动填充功能的表单时不需要的反应【英文标题】:Rshiny:Unwantedreactivitywhenfillinginaformthathintsauserandsupportsanautofillfunction【发布时间】:2021-07-2911:43:21【问题描述】:我正在Shiny中构建一个小型表单应... 查看详情
如何在闪亮的 R 应用程序中使用传单添加控制输入?
】如何在闪亮的R应用程序中使用传单添加控制输入?【英文标题】:HowcaniusetheleafletaddcontrolinputsintheshinyRapp?【发布时间】:2022-01-1613:43:04【问题描述】:我想在地图内使用带有checkboxGroupInput的闪亮传单制作地图,并使用checkboxGro... 查看详情
调整/更新过滤器选择以适应闪亮的 DT 数据表中已应用的过滤器
】调整/更新过滤器选择以适应闪亮的DT数据表中已应用的过滤器【英文标题】:Adapt/updatefilterchoicestoalreadyappliedfiltersinshinyDTdatatable【发布时间】:2020-01-1200:22:46【问题描述】:我正在使用包DT在r中显示一个闪亮的表格。当我在一... 查看详情
在 R 闪亮中,如何指定用于绘图的反应对象列?
】在R闪亮中,如何指定用于绘图的反应对象列?【英文标题】:InRshiny,howtospecifycolumnofreactiveobjectforplotting?【发布时间】:2021-10-2708:39:54【问题描述】:当第一次调用下面的MWE代码时,主面板中会出现一个包含2列的默认值的表格... 查看详情
在 R 闪亮中,如何使“observeEvent”不会被“updateSelectizeInput”的更改触发
】在R闪亮中,如何使“observeEvent”不会被“updateSelectizeInput”的更改触发【英文标题】:InRshiny,howtomake\'observeEvent\'NOTgettriggeredbychangesfrom\'updateSelectizeInput\'【发布时间】:2021-03-0408:28:30【问题描述】:如何使“observeEvent”不会被... 查看详情
在并行 foreach 计算中使用标准 R 闪亮进度条
】在并行foreach计算中使用标准R闪亮进度条【英文标题】:UsingstandardRshinyprogressbarinparallelforeachcalculations【发布时间】:2019-06-2903:48:06【问题描述】:我正在尝试使用doParallel后端在并行foreach循环中使用标准R闪亮进度条。但是,... 查看详情
在 R 闪亮的模块中使用 actionButton + insertUI 创建多个输入
】在R闪亮的模块中使用actionButton+insertUI创建多个输入【英文标题】:usingactionButton+insertUIinRshinymodulestocreatemultipleinputs【发布时间】:2021-11-0615:26:13【问题描述】:我创建了一个模块来帮助我接受1)一个excel文件2)工作表名称的文... 查看详情
在图表中选择活动跟踪并在 R 闪亮的数据表中显示
】在图表中选择活动跟踪并在R闪亮的数据表中显示【英文标题】:SelectionofactivitytraceinachartanddisplayinadatatableinRshiny【发布时间】:2018-06-0516:27:54【问题描述】:如果您运行下面的RShiny脚本,您会在RShiny仪表板中看到两个框,左侧... 查看详情