英文:
How to display a spinner before a JavaScript file is loaded?
问题
我有一个Shiny应用程序,加载了一个巨大的JavaScript文件(>17Mo)。我想要在JavaScript文件加载完成之前显示一个旋转器。这在shinybusy中无法实现:旋转器只会在JS文件加载完成后出现。
英文:
I have a Shiny app which load a huge JavaScript file (>17Mo). I'd like show a spinner until the JavaScript file is loaded. That does not work with shinybusy: the spinner only appears after the JS file has been loaded.
library(shiny)
library(shinybusy)
library(bslib)
ui <- page_sidebar(
tags$head(
tags$script(src = "HUGE_JAVASCRIPT_FILE.js")
),
busy_start_up(
loader = spin_epic("orbit", color = "#FFF"),
text = "Loading...",
timeout = 1500,
color = "#FFF",
background = "#112446"
),
title = "Gröbner implicitization with GIAC",
sidebar = sidebar(
textInput(
"equations",
"Equations: ",
value = "x = a*cost, y = b*sint"
),
textInput(
"relations",
"Relations: ",
value = "cost^2 + sint^2 = 1"
),
textInput(
"symbols",
"Symbols: ",
value = "cost, sint, a, b"
),
actionButton("go", "Run", class = "btn-primary")
)
)
server <- function(input, output, session) { }
shinyApp(ui, server)
答案1
得分: 2
我会添加defer
属性,您可以使用onload
属性来运行一些代码,例如Shiny.setInputValue
以通知服务器关闭旋转器。我们只需要引入一个小的延迟(setTimeout
),以确保Shiny
框架已加载(如果有人找到不需要此解决方法的解决方案,我会非常高兴学到)。
设置
library(here)
library(data.table)
dir.create("www")
fn <- here("www", "larger.js")
fwrite(list(c(rep("console.log(1);", 2.5e4), "alert('done');")), fn)
文件夹结构
.
├── app.R
└── www
└── larger.js
代码
library(shiny)
library(shinybusy)
library(bslib)
ui <- page_sidebar(
tags$head(
tags$script(HTML("function done() {
setTimeout(() => Shiny.setInputValue('done', true), 100)
}")),
tags$script(src = "larger.js", defer = NA, onload = "done()")
),
busy_start_up(
loader = spin_epic("orbit", color = "#FFF"),
text = "Loading...",
mode = "manual",
color = "#FFF",
background = "#112446"
),
title = "Gröbner implicitization with GIAC",
sidebar = sidebar(
textInput(
"equations",
"Equations: ",
value = "x = a*cost, y = b*sint"
),
textInput(
"relations",
"Relations: ",
value = "cost^2 + sint^2 = 1"
),
textInput(
"symbols",
"Symbols: ",
value = "cost, sint, a, b"
),
actionButton("go", "Run", class = "btn-primary")
)
)
server <- function(input, output, session) {
observeEvent(input$done,
remove_start_up())
}
shinyApp(ui, server)
英文:
I would add the defer
property and you can use the onload
property to run some code once it is loaded, for instance Shiny.setInputValue
to notify the server to close the spinner. We just have to introduce a small delay (setTimeout
) , to make sure the Shiny
framework is loaded (if somebody finds a solution which does not require this hack, I would be very happy to learn).
Setup
library(here)
library(data.table)
dir.create("www")
fn <- here("www", "larger.js")
fwrite(list(c(rep("console.log(1);", 2.5e4), "alert('done');")), fn)
Folder Structure
.
├── app.R
└── www
└── larger.js
Code
library(shiny)
library(shinybusy)
library(bslib)
ui <- page_sidebar(
tags$head(
tags$script(HTML("function done() {
setTimeout(() => Shiny.setInputValue('done', true), 100)
}")),
tags$script(src = "larger.js", defer = NA, onload = "done()")
),
busy_start_up(
loader = spin_epic("orbit", color = "#FFF"),
text = "Loading...",
mode = "manual",
color = "#FFF",
background = "#112446"
),
title = "Gröbner implicitization with GIAC",
sidebar = sidebar(
textInput(
"equations",
"Equations: ",
value = "x = a*cost, y = b*sint"
),
textInput(
"relations",
"Relations: ",
value = "cost^2 + sint^2 = 1"
),
textInput(
"symbols",
"Symbols: ",
value = "cost, sint, a, b"
),
actionButton("go", "Run", class = "btn-primary")
)
)
server <- function(input, output, session) {
observeEvent(input$done,
remove_start_up())
}
shinyApp(ui, server)
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论