RMarkdown reveal.js Präsentationscode Falten

Question

Ich bereite eine RMarkdown reveal.js Präsentation vor. Ich möchte die R-Code-Abschnitte in der Folie in der Natur faltbar sein.

Meine Yaml-Header sieht so aus, aber die Code-Faltung ist nicht in der endgültigen Präsentation sichtbar.

--- 
title: "Untitled" 
output: 
    revealjs::revealjs_presentation: 
    code_folding: hide 

--- 


## R Markdown 

This is an R Markdown presentation. Markdown is a simple formatting syntax for authoring HTML, PDF, and MS Word documents. For more details on using R Markdown see <http://rmarkdown.rstudio.com>. 

When you click the **Knit** button a document will be generated that includes both content as well as the output of any embedded R code chunks within the document. 


## Slide with R Code and Output 

```{r} 
summary(cars) 
``` 

## Slide with Plot 

```{r, echo=FALSE} 
plot(cars) 
``` 

Hinzufügen code_folding: hide Werke für regelmäßige RMarkdown Datei.

Ist code_folding für die Präsentation nicht verfügbar? Gibt es einen alternativen Weg, den ich ausprobieren sollte?

Answer 1

Ich fiedelte etwas. Vermutung, das funktioniert nur für Quellcode-Chunks, könnte aber auf andere Elemente erweitert werden. Der Großteil des Codes stammt nur aus meiner Antwort, die oben in meinem Kommentar erwähnt wurde.

Voll MRE:

--- 
title: "Untitled" 
output: 
    revealjs::revealjs_presentation: 
    self_contained: true 
--- 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script> 
$(document).ready(function() { 
    $chunks = $('div.sourceCode'); // get all divs containing source code... 
    // add the button and a wrapping container to each of them... 
    $chunks.each(function() { 
    $(this).prepend('<div class=\"but_con\"><div class=\"showopt\">Show Source</div></div>'); // add the button and a wrapping container to each of them... 
    $(this).find('code').toggle(); // hide them right away... 
    }); 

    // definition of the function to toggle visibility 
    // we select all buttons, and add a click function 
    $('.showopt').click(function() { 
    var label = $(this).html(); 
    if (label.indexOf("Show") >= 0) { 
     $(this).html(label.replace("Show", "Hide")); 
    } else { 
     $(this).html(label.replace("Hide", "Show")); 
    } 
    $(this).parent().siblings('pre').children('code').slideToggle('fast', 'swing'); 
    }); 

}); 
</script> 


<style> 
div.but_con { 
    margin: auto; 
    width: 90%; 
    padding-bottom: 10px; 
} 

div.showopt { 
    font-size: 35%; 
    background-color: #004c93; 
    color: #FFFFFF; 
    width: 100px; 
    height: 20px; 
    text-align: center; 
    vertical-align: middle !important; 
    float: right; 
    font-family: sans-serif; 
    border-radius: 8px; 
    margin-bottom: 10px; 
} 

.showopt:hover { 
    background-color: #dfe4f2; 
    color: #004c93; 
} 
</style> 

## R Markdown 

This is an R Markdown presentation. Markdown is a simple formatting syntax for authoring HTML, PDF, and MS Word documents. For more details on using R Markdown see <http://rmarkdown.rstudio.com>. 

When you click the **Knit** button a document will be generated that includes both content as well as the output of any embedded R code chunks within the document. 


## Slide with R Code and Output 

```{r} 
summary(cars) 
``` 

## Slide with Plot 

```{r, echo=FALSE} 
plot(cars) 
```