I have a flexdasboard with a page that contains 1 plot then below it a table. The table currently is compressed, so whilst it shows 25 rows it has them all within a scroll option so you can only view 2 of those rows at a time. How can I change this?
I am currently coding this with:
---
title: "Plots and tables"
output:
flexdashboard::flex_dashboard:
orientation: rows
vertical_layout: scroll
---
{r setup, include=FALSE}
library(flexdashboard)
library(ggplot2)
library(dplyr)
library(tidyverse)
library(data.table)
library(plotly)
library(htmlwidgets)
library(DT)
Page 1 {style="position:relative;"}
================================
{r fig.width=14, fig.height=10}
plotlyp1 <- ggplotly(p1)
plotlyp1
Row {style="height:100pc;"}
--------------------------------------------------------
### {data-height=10000}
{r}
DT::datatable(one.data_bp,
rownames = FALSE, options = list(pageLength = 25, lengthMenu = c(5, 10, 15, 20)), filter = 'top', height=10000
)
I've removed the back ticks so everything is visible as code. The table this outputs looks like this:
So this has the 25 rows like I code for, but they are condensed and need scrolling with only 1 or 2 rows immediately visible at a time, how do I change the height of the table so at least 5/25 of the rows are visible?
Edit: I've technically fixed it and increased the number of rows visible by changing the Row setting to:
Row {.tabset .tabset-fade}
--------------------------------------------------------
Luckily I don't mind the table looking like it's in a tab, but I feel like this isn't the best or most direct fix, is there anything I can do?
An answer to this had been posted in another forum: https://community.rstudio.com/t/dt-datatable-output-too-small-in-rmarkdown-flesxdashboard/124243/3. The datatable will be height-adjusted based on the available space. The following code has to be pasted after the YAML header (so the approach is similar to nap's answer).
<style>
.dataTables_scrollBody {
max-height: 100% !important;
}
</style>
I had the same problem as you, but only on one PC, not on another. Maybe something about the version of a package, but this code helped.
Had the same issue and I wasn't able to find an rmarkdown option or a DT option to fix this, but this worked for me - I put this CSS style to my rmarkdown:
<style>
.dataTables_scrollBody {
height:400px !important;
max-height:400px !important;
}
.chart-stage-flex {
overflow:auto !important;
}
</style>
Both height and max-height need to be there, but I don't believe they need to match. You can try different arguments for each, but for me, 100% created a container that was too large and didn't scroll. And there are other height arguments you may wish to try: https://developer.mozilla.org/en-US/docs/Web/CSS/height.
Since I used a fixed height, I added overflow:auto style to .chart-stage-flex so that a scroll bar would appear when the window is smaller than 400px.
I'd love to hear if anyone knows how to control this from DT or knitr, etc.
Related
I want to include some text above the graphics in the main area of a frame in Flexdashboard storyboard. Here's the minimal example.
---
title: "Title"
output:
flexdashboard::flex_dashboard:
orientation: rows
vertical_layout: fill
horizontal_layout: scroll
runtime: shiny
---
Storyboard name {.storyboard}
=====================================================================
### Storyboard frame 1
```{r}
renderPlot({
plot(rnorm(1e3))
})
```
>Footnote
***
Data commentary text.
When I add the text just above and outside the R chunk, the graph gets truncated at the bottom.
The graph needs to be inside renderPlot() to include interactive elements. It appears the problem is because the height parameter of renderPlot() is "auto", which automatically sets the height of the graphic to the height of the whole frame, and since the text is included, the height that it sets means the graph doesn't fit the area less the text and gets truncated. I found by experimenting the height can be set to a fixed size in pixels. I can set the height in pixels by trial-and-error that would look OK on my screen, but unfortunately it doesn't fully solve the problem, because users who open the app in a different screen resolution would get a messed up layout.
Personally speaking, fixing the height is not a big issue, fixing the width is the bigger problem for users with different screens. Both overflow height and width can be converted to a scrollable page, but it is always comfortable to scroll the document vertically but not horizontally, and this is what most websites are doing. Anyhow, if you don't want to fix the height of the plot with px, the easiest way is to add a scroll bar to the left column so users can scroll and see the hidden content:
Add this chunk and you are all set.
```{css}
.chart-wrapper .chart-stage {
overflow-y: auto;
}
```
I'm trying to set up a flexdashboard to convey some information and am having some problems with scrolling. Putting vertical_layout: scroll in the header does no good, it leads to the flexdashboard cutting off halfway down the page. When I set vertical_layout fill, I can see more info, but it still goes off the page. In neither case is a vertical (or horizontal) scrollbar available to enable the user to see the cut-off information.
Although I have more text than below, this is illustrative of the problem. Does anyone know why this may be happening or if there might be any ways around it? I'm using a tablet currently but have tried using standard columns with no success. The problem is on Page 2. Thanks.
---
title: "title"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: scroll
---
Introduction
===
Column
---
* some text
Page 2
===
Column {.tabset}
---
### h3
* test
#### h4
* text
#### h4
* text
### h3
#### h4
* some text
#### h4
* some text
I am using RMarkdown to create an ioslide presentation with shiny.
Some of my slides do not actually fit on one page and are truncated.
Since this is a HTML output, I would like to add a scroll bar to make my long slides scrollable.
I have been googling a lot and found a partial solution to make R code chunks scrollable. However I want to make my slides scrollable regardless of the content.
This is a toy Rmd example giving slides not fitting on one page:
---
title: "Untitled"
date: "30 October 2018"
output: ioslides_presentation
runtime: shiny
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
```
## Shiny Presentation
- A very long
- and boring
- list of
- bullet points
- just a
- toy example
- obviously
- not over yet
- almost
- not quite
- finally
- out of frame!
I would like to make this slide scrollable since it does not fit on one page.
Edit: I am not sure why this is being heavily downvoted - would appreciate a constructive comment :) In the meantime, I did remove the css tag which may have brought people not familiar with rmarkdown.
Self-answer:
The bit of CSS that will make the slide scrollable (both horizontally and vertically but you just have to remove one line if only vertical scrolling is needed) is:
slides > slide {
overflow-x: auto !important;
overflow-y: auto !important;
}
Note that the slide gets a height from ioslide so there is no need to specify a height (and in fact it seems to introduce visual glitches if you do). Using auto instead of scroll makes sure a scrollbar only appears when there is a need.
You can either add this CSS directly in the Rmd in between <style> tags or put the CSS in a separate file (e.g. scrollable_slides.css).
The CSS file can then be added to the Rmd like this (assuming scrollable_slides.css is in the same directory as the Rmd):
---
title: "..."
output:
ioslides_presentation:
css: 'scrollable_slides.css'
runtime: shiny
---
Whenever I use captions in tables,
like
kable(df[1:10, c(7,1:6)], caption = "This is a caption")
the tables and content in the pdf generated by knitr are pushed below the limits of the bottom margin, thus becoming unreadable. Sometimes entire sections are missing, hidden off margins.
Also, plots positions go crazy: they are printed anywhere but the right place in the pdf.
using results="asis" in chunk options doesn't help.
Using pander causes the same problems.
If I remove all table captions and use some \newpage in the .rmd,
the pdf margins are fine.
Is there a safe way to use table captions?
The pdf in question is here: see page 14 for an entire section missing and table hiding in the bottom margins. Also, the plots are where they want, like if they had proper needs...
github repo
this is kind of a anti-climax,
but as it happens,
this problem was being caused by chunks that printed var values to the document, something like:
```{r}
sampled.values <- sample(1:100, 10)
sampled.values
```
when rendered through render(), this code chunk prints the value of sampled.values and this ruins the pdf pagination.
That's it: all page bottom margins are ok now that I removed all those var calls.
I want to have an image to fill the whole slide.
I have tried to use a div with absolute positioning, however, that will position the image partly outside of the slide.
I think I could make that work, if I hard code the resolution in, however, I would like to make it work on another machine as well. (and preferably even with the wide screen switching)
An example to reproduce/test:
---
title: "some title"
author: Me
company: Me
date: 21-02-2017
output:
ioslides_presentation
---
##
edit:
I am aware of:
Rpresentation in Rstudio - Make image fill out the whole screen
However, there they switched to slidy_presentation and I already have custom css for ioslides. If possible I would like to stay with ioslides. And it should be possible, right? :)
I got an idea when I was looking for getting my text output even smaller.
I found this: Markdown: Change default font size of code chunks in ioslides
Now I am using the following custom css:
.fullslide img {
margin-top: -85px;
margin-left: -60px;
}
Then in in the rmarkdown file I can do:
## {.fullslide}
If you now want to make sure that you get the full image, make sure the image has the following dimensions:
widescreen: 1100 x 700
normal: 900 x 700
I just make sure I edit them using GIMP or something.
I have not yet figured out how I can suppress the page numbering, but apparently you cannot suppress page numbers on a per slide basis. :(