Skip to content

Add support for legend/axis text size#66

Merged
Faye-yufan merged 15 commits intomasterfrom
64-legendaxis-font-size
Jul 12, 2022
Merged

Add support for legend/axis text size#66
Faye-yufan merged 15 commits intomasterfrom
64-legendaxis-font-size

Conversation

@Faye-yufan
Copy link
Copy Markdown
Contributor

@Faye-yufan Faye-yufan commented Jun 30, 2022

Enable size options in axis.text.x, axis.text.y, legend.text to be aligned with ggplot2 syntax. Try to enable axis.text and text as well, it may require more logic in compiler.

  • Add relative 'size' parameters into the compiler for extracting input parameters in theme().
  • Add d3 attributes in the renderer to display the text size.
  • Modify plot strip/axis calculation in the renderer, to make the plot displayed properly.

closes #64

@Faye-yufan Faye-yufan linked an issue Jun 30, 2022 that may be closed by this pull request
@Faye-yufan
Copy link
Copy Markdown
Contributor Author

Font size, the number, is able to be extracted from theme() via compiler and directly passed into JS with px as measurement. But don't know why ggplot2 rel() mechanics cannot take effect.

Maybe it's because the plot_theme() function being called inside compiler did not compute the relative scale size? But the no-warning compiler theme testthat unit shows that it can successfully convert the relative text size, like rel(0.5) of 12 is 6.

Also, rel S3 class is numeric, is.numeric(rel(2)) == TRUE.

getStyleValue(info1$html, '//g[@class="yaxis axis yaxis_1"]//g[@class="tick major"]//text',
"font-size")
expect_match(axis.x.style.value, "20px")
expect_match(axis.y.style.value, "12px")
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

these tests look good!

Comment thread R/z_animintHelpers.R Outdated
#' @return size
axesTextSize <- function(xy.size, theme.pars){
text.size <- if(is.null(theme.pars[["text"]]$size)){11}else{theme.pars[["text"]]$size}
axis.text.size <- if(is.null(theme.pars[["axis.text"]]$size)||theme.pars[["axis.text"]]$size==rel(0.8)){
Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In the output, the axis.text default to 0.8, and printed out as 0.8 * because this line of code in theme-element.r

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function should be modified to be more clear and less fragile.

@Faye-yufan Faye-yufan requested a review from tdhock July 11, 2022 17:04
Comment thread R/z_animint.R
axis.text <- theme.pars[[s("axis.text.%s")]]
## TODO: also look at axis.text! (and text?)
size <- axesTextSize(axis.text$size, theme.pars)
size <- calc_element(s("axis.text.%s"), theme.pars)$size
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this looks like a step in the right direction, good job!

@tdhock
Copy link
Copy Markdown
Collaborator

tdhock commented Jul 11, 2022

code looks good but can you please paste a screenshot of the test cases after rendering them with bigger text size? I want to make sure the web page looks reasonable / readable even after playing with the text size. (I know you have expect_ statements that check for the size of individual elements that you resized, but it is also importantant to check that the plot is still OK overall)

@tdhock
Copy link
Copy Markdown
Collaborator

tdhock commented Jul 11, 2022

For documenting these new features probably would be good to add to Plot-specific options under Chapter 6 Animint options, https://rcdata.nau.edu/genomic-ml/animint2-manual/Ch06-other.html#plot-options

@Faye-yufan
Copy link
Copy Markdown
Contributor Author

Got it, will write the document after it merges.
This is how the axes and legend look like inside the testing environment:

@tdhock
Copy link
Copy Markdown
Collaborator

tdhock commented Jul 11, 2022

looks great, thanks very much, please merge!

@Faye-yufan Faye-yufan merged commit 0a2988f into master Jul 12, 2022
Comment thread R/theme-defaults.r
Comment on lines -101 to +103
legend.text = element_text(size = rel(0.8)),
legend.text = element_text(size = rel(16/11)),
legend.text.align = NULL,
legend.title = element_text(hjust = 0),
legend.title = element_text(size = rel(16/11), hjust = 0),
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

hi @Faye-yufan did you know that these changes to default text sizes result in much larger defaults? Here are some comparisons of old (left) vs new (right)
animint2-manual-before-after-web
animint2-manual-before-after-static
was this intentional? (I did not notice these changes in my initial review of this PR)
These new defaults seem to be often too large for the context of the animint2 manual, so I am thinking of changing them back to the original values for the animint2 manual, and I wonder if we should change the defaults back as well, or keep these new bigger defaults? what do you think?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @tdhock thanks for the info! I did not think of this situation before.
For here, I believe it's because the plot is printed by the data generated by ggplot_build and did not render to html, so the text size gets bigger in ggplot.

I changed the default text sizes for the convenience of rendering html, since previously animint set legend text size to 16px and I just thought the change to rel(16/11) would pass 16 as default to html.

Yes, I think we should change the defaults back in ggplot default, and change our default text size in JS side.

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the top image was animint/html and the bottom was static/ggplot_build/png.
that is a good idea to change back the defaults in R code (so then static/ggplot_build/png looks the same), and also to change the defaults in JS (so the animint/html is more reasonably sized). Please create another PR for that.

@Faye-yufan Faye-yufan deleted the 64-legendaxis-font-size branch August 1, 2022 02:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Support for specifying legend/axis font size via theme()

2 participants