Flexdashboard introJS

Question

我正在尝试在flexdashboard（闪亮的运行时）中实现introjs，但我不确定是什么原因造成的。我在下面的flexdashboard中的introjs实现是基于一个很好的实现的闪亮实现，请参阅以下示例：https://github.com/FrissAnalytics/shinyJsTutorials/tree/master/tutorials/materials4/BasicDemoIntroJS。

请注意，下面的代码会调用三个文件：introjs.min.css，intro.min.js和app.js，所有这些文件都可以在上一个网址中找到。

预期的行为是actionButton会触发与变量“steps”中定义的元素相对应的介绍。

title: "IntroJS Test"
output: 
  flexdashboard::flex_dashboard:
    orientation: columns
    social: menu
    source_code: embed
    runtime: shiny
---

```{r setup, include=FALSE}

library(devtools)
library(flexdashboard)
library(shiny)
library(jsonlite)
library(data.table)


# create help data table
steps <- data.table(step = c(1, 2), element = paste0('#step', c(1, 2)), intro = paste0('text step ', c(1, 2)), position = 'bottom')

# set help content
session$sendCustomMessage(type = 'setHelpContent', message = list(steps = toJSON(steps) ))

# listen to the action button
observeEvent(input$help,{

  # on click, send custom message to start help
  session$sendCustomMessage(type = 'startHelp', message = list(""))

})

# Include IntroJS styling
includeCSS("introjs.min.css")

# Include IntroJS library
includeScript("intro.min.js")

# Include IntroJS styling
includeCSS("app.js")


```

### Intro Elements

```{r}

fluidRow(
     column(4, div(id="step1", class="well", "element1")),
     column(4, div(id="step2", class="well", "element2")),
     column(4, div(id="step3", class="well", "element3"))
)

fluidRow(
     column(4, div(id="step4", class="well", "element4")),
     column(4, div(id="step5", class="well", "element5")),
     column(4, div(id="step6", class="well", "element6"))
)


```

### actionButton

```{r}

# action button
actionButton(inputId="help", label="start", class="btn-success")


```