Javascript RShiny动态弹出窗口（可移动）

我在一个仪表板上工作，我想创建一个动态弹出窗口，即我们可以移动。 我可以创建一个弹出窗口，但这个是静态的，我喜欢那个可以把它移到右边，左边

我的弹出窗口示例：

library(shiny)
library(shinyBS)

shinyApp(

  ui =
    fluidPage(
      sidebarLayout(
        box(actionButton("tabBut", "View Table")),
        mainPanel(
          bsModal("modalExample", "Data Table", "tabBut", size = "large",
                  dataTableOutput("distTable"))))),

  server =
    function(input, output, session) {
      output$distTable <- renderDataTable({
        x    <- faithful[, 2]
        bins <- seq(min(x), max(x), length.out = 30 + 1)
        tab <- hist(x, breaks = bins, plot = FALSE)
        tab$breaks <- sapply(seq(length(tab$breaks) - 1), function(i) {
          paste0(signif(tab$breaks[i], 3), "-", signif(tab$breaks[i+1],    3))})
        tab <- as.data.frame(do.call(cbind, tab))
        colnames(tab) <- c("Bins", "Counts", "Density")
        return(tab[, 1:3])}, 
        options = list(pageLength=10))}
)

库（闪亮）
图书馆（shinyBS）
shinyApp(
用户界面=
流动摄影(
侧边栏布局(
框（操作按钮（“选项卡”、“查看表”），
主面板(
bsModal（“modalExample”、“数据表”、“tabBut”、size=“large”，
dataTableOutput（“distTable”()())），
服务器=
功能（输入、输出、会话）{
输出$distTable您可以尝试手动执行此操作：

1） 添加脚本

2） 添加可拖动的

3） 编辑css

比如：

ui=
流动摄影(
标签$head（HTML（'
')),
标记$script（HTML（'$（窗口）.load（函数（））{
$（“#modalExample”）.draggable({
句柄：“.modal头”
});
});')),
标签$style（HTML（“
.modal-in{
不透明度：0；
}    
")),
侧边栏布局(
框（操作按钮（“选项卡”、“查看表”），
主面板(
bsModal（“modalExample”、“数据表”、“tabBut”、size=“large”，
dataTableOutput（“distTable”()())）
使用shinyjqui软件包。有关示例脚本，请参阅：


更改：

jqui_可拖动（选择器='.modal content'）

进入：

jqui_draggable（ui='.modal content'）
查看他们如何使用absolutePanel

，它允许您添加

draggable=T

。应该以最小的努力为您提供所需的内容。感谢absolutePanel确实也可以使用。

 ui =
    fluidPage(
      tags$head(HTML('<script src="//code.jquery.com/jquery-1.10.2.js"></script>
                    <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>')),
        tags$script(HTML('  $(window).load(function(){
                        $("#modalExample").draggable({
                        handle: ".modal-header"
                                   });
                                   });')),
            tags$style(HTML("
            .modal-backdrop.in {
                opacity: 0;
            }    
                ")),
      sidebarLayout(
        box(actionButton("tabBut", "View Table")),
        mainPanel(

          bsModal("modalExample", "Data Table", "tabBut", size = "large",
                  dataTableOutput("distTable")))))