Visualizza diversi blocchi di codice in modo conciso

Sto creando un blog con il blogdownquale confrontare codice da R e codice da Stata. Vorrei mostrare entrambi i codici in modo che l'utente possa confrontare come è fatto in R e in Stata. Tuttavia, mettere due o più blocchi di fila (codice per R, codice per Stata + output) rende la lettura abbastanza scomoda.

Mi sono venuti in mente diversi layout per includere diversi blocchi, ma non so se siano già implementati o se sia possibile farlo.

Dispone di un pulsante per visualizzare / nascondere blocchi (un pulsante per blocco )

Un'idea sarebbe quella di avere:

i blocchi di codice R visibili per impostazione predefinita nell'articolo,
i blocchi di codice Stata sono invisibili per impostazione predefinita ma visibili se l'utente fa clic su un pulsante

Questa persona e questa persona sono riuscite a piegare i loro blocchi di codice nel blogdown ma apparentemente nasconde o mostra tutti i blocchi per impostazione predefinita. Come posso nascondere solo alcuni blocchi per impostazione predefinita? Esiste un'opzione (come le opzioni eval, echo...) che nasconde o mostra la parte di codice blogdown?

Bocconi con "linguette"

Il titolo di questa parte parla da solo: è possibile avere le schede in un blocco in modo da poter passare da un codice all'altro (proprio come le schede nei browser Web per esempio)?

Mostra due blocchi affiancati

In alcuni blogdowntemi (forse tutti, non lo so), la larghezza è piuttosto ridotta e c'è uno spazio inutilizzato sui lati. Pertanto, è possibile aumentare la larghezza di alcune parti di un articolo e visualizzare due blocchi affiancati?

Hai idea di come realizzare uno di questi layout blogdown?

r blogdown

— bretauv
fonte

Sembro Python e R fianco a fianco da qualche parte, non potrei replicarlo, pregando che qualcuno lo risolva, ho un blog che migliorerebbe davvero se fosse possibile

— Bruno

Ti blogdownconsente di aggiungere CSS? Usando CSS puoi creare due blocchi di codice e metterli fianco a fianco. Con CSS puoi anche visualizzare o nascondere i blocchi e potresti essere in grado di fare le schede, ma non è questo il mio punto di forza.

— BeastCoder

@BeastCoder Penso di blogdownpoter usare i CSS (vedi qui ) ma non l'ho mai usato, quindi ci proverò, ma non credo che sarò in grado di farlo

— bretauv

@bretauv Penso che se potessi capirlo potrebbe valerne la pena, posso lasciarti tre tutorial che possono metterti completamente in funzione se vuoi intraprendere quel percorso.

— BeastCoder

1. youtu.be/UB1O30fR-EE (che è un corso di crash HTML) 2. youtu.be/yfoY53QXEnI (che è un corso di crash CSS) 3. youtu.be/JJSoEo8JSnc (flexblock) Queste cose dovrebbero essere in grado di farti pezzi di codice affiancati ma ti forniranno anche informazioni future che saranno sempre utili. Aggiungere il codice che scompare e riapparire potrebbe essere più difficile, ma se vuoi un link per iniziare, fammelo sapere. Non ho familiarità con il blogdown ma potrebbe esserci un altro modo in cui non hai bisogno dei CSS. Ad ogni modo, consiglierei il CSS

— BeastCoder il

Risposte:

Ok, ecco una risposta parziale. Potrei semplicemente mettere diversi pezzi fianco a fianco ma non so come realizzare le altre proposizioni nel mio post.

Questo è quello che ho fatto. Sulla base di questa pagina , ho inserito del codice CSS nel mio .Rmarkdownfile contenente uno degli articoli del mio blog.

<style>
.flex-container {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  overflow: visible;
}

.flex-container > div {
  width: 200px;
  margin: 10px;
  text-align: left;
  line-height: 75px;
  font-size: 30px;
}
</style>
<div class="flex-container">
```{r message = FALSE}
head(mtcars)
```
</div>

Qui inserirà il codice head(mtcars)e il suo output in due blocchi affiancati. Se hai messo un altro pezzo prima </div>, l'ordine sarà: un pezzo, il suo output, un pezzo, il suo output, ecc. Ci sono molte opzioni per personalizzare la visualizzazione delle due (o più) colonne. Ci sono diverse cose che non potrei fare comunque:

Non so se sia possibile ordinare tre pezzi. Ad esempio, se aggiungi un pezzo dopo quello con head(mtcars), l'ordine sarà: chunk1, output di chunk1, chunk2. Non so se può essere riorganizzato in: chunk1, chunk2, output di chunk1.
Se inserisco questo codice in un file CSS separato, il pezzo in questione verrà visualizzato come se fosse un testo normale. Come posso inserire questo codice in un file CSS esterno? So che questo è spiegato nel blogdown's libro , ma io non riuscivo a farlo funzionare. Quello che ho provato finora è:
- inserisci il codice sopra (tra <style>e </style>) in un file che ho nominato main.csse che ho inseritothemes/tale-hugo/static/css
- metto il codice qui sotto all'inizio del mio .Rmarkdownfile. Ho provato a sostituire il percorso da mio percorso assoluto del file main.csse ho provato anche solo per sostituire style.cssdal main.cssnel seguente codice, ma senza successo
```
<html>
    <link rel="stylesheet" href="/css/style.css" />
</html>
```
- Ho anche provato a inserire il percorso in customCSS config.tomlma non ha funzionato
Dato che i CSS sembravano funzionare, volevo vedere se era possibile creare schede con esso. È davvero possibile, ma richiede un po 'di codice JavaScript e non l'ho mai usato prima, quindi se qualcuno può aiutarti, grazie in anticipo.

Fondamentalmente, questa è una base di lavoro che potrebbe essere aggiornata se trovo soluzioni, ma se sai come risolvere alcuni di questi problemi, non esitare.

— bretauv
fonte

@BeastCoder ecco quello che ho fatto finora

— bretauv

Dato che la mia risposta precedente era un po 'confusa e non molto dettagliata, faccio una nuova risposta che va bene con quello che volevo fare (cioè avere la possibilità di piegare alcuni blocchi di codice).

La soluzione è utilizzare il pacchetto di dettagli di Jonathan Sidi , come sottolineato da questa risposta . Inizialmente, lo scopo di questo pacchetto era nascondere alcuni output che occupano molto spazio, come sessionInfonei documenti HTML realizzati con R Markdown (e quindi anche con R Blogdown). Ecco un esempio (tratto dal sito Web del pacchetto):

---
title: "Test"
output: html_document
---

```{r}
library(details)

sessioninfo::session_info()%>%
  details::details(summary = 'current session info')
```

Tuttavia, ciò che voglio nascondere non è l'output di un codice R ma un codice Stata (che non è pensato per essere eseguito), in modo che i lettori possano confrontare il codice R con il codice Stata se lo desiderano. Pertanto, dobbiamo usare un po 'di HTML per farlo:

---
title: "Test"
output: html_document
---

## Regression with R and Stata

```{r, eval=FALSE}
lm(mpg ~ drat, data = mtcars)
```

<details>
<summary> Stata </summary>
```stata
regress y x
```
</details>

Ora, i lettori possono vedere il codice Stata se vogliono e quelli che non vogliono non sono distratti da troppi blocchi di codice. Questo funziona anche per gli articoli Blogdown (dal momento che è "solo" alcuni R Markdown su un sito Web).

Altre funzionalità ( ad esempio personalizzare i blocchi nascosti ) sono dettagliate sul sito Web del pacchetto.

— bretauv
fonte