Question

我在R Shiny - App：

中使用

library(shiny)
library(googleVis)

ui <-fluidRow(
  tags$head(
    tags$script(src="https://d3js.org/d3.v3.min.js", {{ suppressDependencies("d3") }})
  ),
  htmlOutput("timeline")
  )

server <- function(input, output) {

dat <- data.frame(Term=c("1","2","3"),
                  President=c("Whashington", "Adams", "Jefferson"),
                  start=as.Date(x=c("1789-03-29", "1797-02-03", "1801-02-03")),
                  end=as.Date(x=c("1797-02-03", "1801-02-03", "1809-02-03")))

output$timeline <-renderGvis({
                    gvisTimeline(data=dat[,-1], rowlabel="President",
                    start="start", end="end")
          })
    }

shinyApp(ui, server)

svg

我想改变中间矩形的高度。我通过在JavaScript控制台中选择适当的d3.select('svg:nth-child(1) g:nth-child(5) rect:nth-child(2)') .attr('height', 42) .attr('y', 40);元素来实现此目的：

{{1}}

如何将此代码集成到Shiny-App中，以便从头开始将所需的高度和y坐标设置为一个矩形？谢谢你的帮助！

Answer 1

这里的问题是在加载页面后几毫秒内从Google服务器传输时间线。您需要在传输完成后执行JavaScript代码，即在页面初始化后50或500毫秒。以下代码将每50毫秒执行一次，这有效但远非完美。

在用户界面中，您需要一个虚拟输出＆＃34; uiOutput（＆＃34; timelineAdjustment＆＃34;）＆＃34;：
```
uiOutput("timelineAdjustment")
```

在Server中，您需要按如下方式定义它：

autoInvalidate50msec <- reactiveTimer(50, session)
output$timelineAdjustment <- renderUI({
   autoInvalidate50msec()
   HTML("<script type='text/javascript'>d3.select('#timeline svg:nth-child(1) g:nth-child(5) rect:nth-child(2)').attr('height', 42).attr('y', 40);</script>")
})

或者，如果您只是在加载页面后执行一次（1000ms），则为等效定义：

output$timelineAdjustment <- renderUI({
    HTML("<script type='text/javascript'>setTimeout(function() { d3.select('#timeline svg:nth-child(1) g:nth-child(5) rect:nth-child(11)').attr('height', 41).attr('y', 41); },1000);</script>")
})

如果有更好的方法来实现这一点，我很高兴听到！

R闪亮：改变＆＃34;身高＆＃34; gvisTimeline中矩形的属性

1 个答案: