如何在 Shiny 中包含具有反应性 MathJax 元素的 html 代码?
How to include html code with reactive MathJax elements in Shiny?
我正在开发一款旨在帮助学生的闪亮应用程序。它使用学生特定的输入值为每个学生生成一些方程式的解决方案。
问题是 MathJax 方程呈现为常规文本,请参阅最小示例和此图像:
知道如何正确呈现动态 MathJax 元素吗?
我目前的做法:
- 使用带有输入参数 (
params$student
) 的 rmarkdown
文档 (solu_template.Rmd
) 创建学生特定的 markdown 文件;
- 呈现降价文件并将其包含在
ui
.
如 this example 所示,响应式、动态变化的 MathJax 元素是可行的。但是,我想使用更复杂的文件并保持将解决方案模板准备为 rmarkdown
文件的便利。
额外尝试:
- 直接使用
render()
生成的html文件,但不知道如何将其作为动态变化的组件包含在ui
中;
- 用
readLines()
读取生成的html文件,用htmlOutput
显示;没有成功,只是一堆代码。
所以,使用这种方法的问题是如何 render/display 一个动态变化的 html 文件?
欢迎所有想法和建议!
app.R
library(shiny)
library(markdown)
shinyApp(
ui = fluidPage(
selectInput("student", "Student:",
choices = c("Student1", "Student2", "Student3")),
actionButton("show_solu", "Run!"),
hr(),
withMathJax(),
htmlOutput("solu")
),
server = function(input, output, session) {
output$solu <- eventReactive(input$show_solu, {
rmarkdown::render("solu_template.Rmd",
quiet = F, clean = F,
params = list(student = input$student))
solu <- renderMarkdown("solu_template.knit.md")
}
)
}
)
solu_template.Rmd
---
title: "Solution"
params:
student: Student1
output:
html_document:
theme: readable
---
```{r, echo = FALSE}
S = list(Student1 = 1, Student2 = 2, Student3 = 3)
s = S[[params$student]]
```
## Heading
Student dependent initial value:
$s = `r s`$
Some nice reasoning which yields to this equation:
$R = s^2 + \sqrt{2} = `r signif(s^2 + sqrt(2), 3)`$
这里是 renderMarkdown()
方法的解决方案:
应将以下行添加到 renderMarkdown()
生成的 html 代码中,这样浏览器就会知道应该考虑 MathJax 元素来呈现输出:
"<script>MathJax.Hub.Queue(["Typeset", MathJax.Hub]);</script>"
关于上面的例子,这个应该加到app.R的server
函数的末尾:
solu = paste(solu, "<script>MathJax.Hub.Queue([\"Typeset\", MathJax.Hub]);</script>")
如果您可以使用 knitr,我不明白为什么这行不通。我没有使用 'dynamic-math' 但我在 Rmd 文件中使用了相当多的符号,这些文件在一个用于学生的闪亮应用程序中呈现。查看下面链接的回购协议,如果您有任何问题,请告诉我。
https://github.com/vnijs/shiny-site
https://github.com/vnijs/quizr
我正在开发一款旨在帮助学生的闪亮应用程序。它使用学生特定的输入值为每个学生生成一些方程式的解决方案。
问题是 MathJax 方程呈现为常规文本,请参阅最小示例和此图像:
知道如何正确呈现动态 MathJax 元素吗?
我目前的做法:
- 使用带有输入参数 (
params$student
) 的rmarkdown
文档 (solu_template.Rmd
) 创建学生特定的 markdown 文件; - 呈现降价文件并将其包含在
ui
.
如 this example 所示,响应式、动态变化的 MathJax 元素是可行的。但是,我想使用更复杂的文件并保持将解决方案模板准备为 rmarkdown
文件的便利。
额外尝试:
- 直接使用
render()
生成的html文件,但不知道如何将其作为动态变化的组件包含在ui
中; - 用
readLines()
读取生成的html文件,用htmlOutput
显示;没有成功,只是一堆代码。
所以,使用这种方法的问题是如何 render/display 一个动态变化的 html 文件?
欢迎所有想法和建议!
app.R
library(shiny)
library(markdown)
shinyApp(
ui = fluidPage(
selectInput("student", "Student:",
choices = c("Student1", "Student2", "Student3")),
actionButton("show_solu", "Run!"),
hr(),
withMathJax(),
htmlOutput("solu")
),
server = function(input, output, session) {
output$solu <- eventReactive(input$show_solu, {
rmarkdown::render("solu_template.Rmd",
quiet = F, clean = F,
params = list(student = input$student))
solu <- renderMarkdown("solu_template.knit.md")
}
)
}
)
solu_template.Rmd
---
title: "Solution"
params:
student: Student1
output:
html_document:
theme: readable
---
```{r, echo = FALSE}
S = list(Student1 = 1, Student2 = 2, Student3 = 3)
s = S[[params$student]]
```
## Heading
Student dependent initial value:
$s = `r s`$
Some nice reasoning which yields to this equation:
$R = s^2 + \sqrt{2} = `r signif(s^2 + sqrt(2), 3)`$
这里是 renderMarkdown()
方法的解决方案:
应将以下行添加到 renderMarkdown()
生成的 html 代码中,这样浏览器就会知道应该考虑 MathJax 元素来呈现输出:
"<script>MathJax.Hub.Queue(["Typeset", MathJax.Hub]);</script>"
关于上面的例子,这个应该加到app.R的server
函数的末尾:
solu = paste(solu, "<script>MathJax.Hub.Queue([\"Typeset\", MathJax.Hub]);</script>")
如果您可以使用 knitr,我不明白为什么这行不通。我没有使用 'dynamic-math' 但我在 Rmd 文件中使用了相当多的符号,这些文件在一个用于学生的闪亮应用程序中呈现。查看下面链接的回购协议,如果您有任何问题,请告诉我。
https://github.com/vnijs/shiny-site https://github.com/vnijs/quizr