Skip to content

Fixing Legend Position #241

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 15 commits into from
Aug 7, 2015
Merged

Fixing Legend Position #241

merged 15 commits into from
Aug 7, 2015

Conversation

13bzhang
Copy link
Contributor

This pull request is to fix problems in Issue #195.

Right now I have fixes for

  1. move the horizontal position of the legend to the right more
  2. the vertical position of the legend should stay in the middle (made it such that it accommodates legends with different number of items)
p <- ggplot(diamonds, aes(clarity, fill = cut)) + geom_bar(position="dodge")

ggplot2
195_bar_ggplot2

Plotly (old) https://plot.ly/~13bzhang/1104/count-vs-clarity/
195_bar_old_plotly

Plotly (new) https://plot.ly/~13bzhang/1164/count-vs-clarity/

195_bar_new_plotly

The code also works for a legend where the name of the legend items are very, very long:

mydat <- data.frame(cat1 = sample(x = LETTERS[1:10], 
                                  size = 100, replace = TRUE),
                    cat2 = sample(x = c("AAAAAAAAAAAAAAAAAAAAAAAAAAAAA",
                                        "BBBBBBBBBBBBBBBBBBBBBBBBBBBBB",
                                        "CCCCCCCCCCCCCCCCCCCCCCCCCCCCC"),
                                  size = 100, replace = TRUE))
p <- ggplot(mydat, aes(cat1, fill=cat2)) + geom_bar(position="dodge")

https://plot.ly/~13bzhang/1160/count-vs-cat1/
195_very_long

@cpsievert @chriddyp @mkcor

@13bzhang
Copy link
Contributor Author

Something funky is going on where the space between the legend title and legend items increases with the addition of more legend items. This is strange because I times the number of legend items by a constant.

See:
https://plot.ly/~13bzhang/1297/count-vs-cat2/

@13bzhang
Copy link
Contributor Author

It turns out using yanchor = "center" didn't work so well. So I decided to go back to using yanchor = "top" and having some sort of algebraic equation that calculates where the top should be based on the number of items. Also added some tests.

Now the Plotly graphs look normal:
https://plot.ly/~13bzhang/1322/count-vs-cat2/
https://plot.ly/~13bzhang/1316/count-vs-cat1/

@cpsievert
Copy link
Collaborator

The message below was automatically generated after build https://travis-ci.org/ropensci/plotly/builds/73657590

On TravisCI, commit 8136ed6 was successfully merged with 6ff8831 (master) to create dec99f1. A visual testing table comparing 6ff8831 with dec99f1 can be found here ->

http://cpsievert.github.io/plotly-test-table/R/dec99f1/

Detected 193 differences ->

http://cpsievert.github.io/plotly-test-table/R/dec99f1//abline
http://cpsievert.github.io/plotly-test-table/R/dec99f1//area-fillcolor
http://cpsievert.github.io/plotly-test-table/R/dec99f1//area
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-aes-colour-guides-fill-FALSE
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-aes-fill-guides-color-none
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-aes-fill-guides-fill-FALSE
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-aes-fill-guides-fill-none
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-black-outline
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-category-names
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-color
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-dates
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-dodge
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-factor-category
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-identity
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-nocolor
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-position-fill
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-position-stack
http://cpsievert.github.io/plotly-test-table/R/dec99f1//bar-stack
http://cpsievert.github.io/plotly-test-table/R/dec99f1//boxplot-datetime
http://cpsievert.github.io/plotly-test-table/R/dec99f1//boxplot
http://cpsievert.github.io/plotly-test-table/R/dec99f1//contour
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-blank-minor-major
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-blank-minor
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-blank-x
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-blank-y
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-coord-fixed
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-coord-fixed-ratio
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-coord-ylim
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-custom-formatter
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-flevels
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-fonts
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-label-funs
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-linear-axes
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-log2-coord
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-log2-labels
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-log2-scale
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-no-x-title
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-scale.hide
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-scale-name
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-scale_y_log10-labels
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-scale_y_log10
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-axes-ylim.hide
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-bar-dodge-color-err4
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-bar-dodge-color-error
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-bar-dodge-color
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-bar-error-diff
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-bar-error-narrow
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-bar-error-wide
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-basic-bar
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-basic-horizontal-line
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-dashed-red-line
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-scatter-basic
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-scatter-facet-hline-line-stat
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-scatter-facet-hline
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-scatter-facet-hline-vline
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-scatter-facet
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-scatter-hline
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-scatter-hline-vline
http://cpsievert.github.io/plotly-test-table/R/dec99f1//cookbook-lines-scatter-hline-vline-stat
http://cpsievert.github.io/plotly-test-table/R/dec99f1//date-class-Date
http://cpsievert.github.io/plotly-test-table/R/dec99f1//date-irregular-time-series
http://cpsievert.github.io/plotly-test-table/R/dec99f1//date-strings
http://cpsievert.github.io/plotly-test-table/R/dec99f1//density2d
http://cpsievert.github.io/plotly-test-table/R/dec99f1//density-color
http://cpsievert.github.io/plotly-test-table/R/dec99f1//density-fill
http://cpsievert.github.io/plotly-test-table/R/dec99f1//density-histogram
http://cpsievert.github.io/plotly-test-table/R/dec99f1//density-simple
http://cpsievert.github.io/plotly-test-table/R/dec99f1//errorbar-horizontal
http://cpsievert.github.io/plotly-test-table/R/dec99f1//errorbar
http://cpsievert.github.io/plotly-test-table/R/dec99f1//facet_grid_free
http://cpsievert.github.io/plotly-test-table/R/dec99f1//facet_grid_free_x
http://cpsievert.github.io/plotly-test-table/R/dec99f1//facet_grid_free_y
http://cpsievert.github.io/plotly-test-table/R/dec99f1//facet_wrap_free
http://cpsievert.github.io/plotly-test-table/R/dec99f1//facet_wrap_free_x
http://cpsievert.github.io/plotly-test-table/R/dec99f1//facet_wrap_free_y
http://cpsievert.github.io/plotly-test-table/R/dec99f1//heatmap
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-counts
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-Date-bins
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-dates
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-density-binwidth
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-density
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-fill-factor-dodge
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-fill-factor-facets
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-fill-factor-identity
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-fill-factor
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-fill
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-fixed-fill-color
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-POSIXt-bins
http://cpsievert.github.io/plotly-test-table/R/dec99f1//histogram-vline
http://cpsievert.github.io/plotly-test-table/R/dec99f1//hline-factor
http://cpsievert.github.io/plotly-test-table/R/dec99f1//hline-multiple
http://cpsievert.github.io/plotly-test-table/R/dec99f1//hline
http://cpsievert.github.io/plotly-test-table/R/dec99f1//labels-angles
http://cpsievert.github.io/plotly-test-table/R/dec99f1//labels-ggtitle
http://cpsievert.github.io/plotly-test-table/R/dec99f1//labels-scale_x_continuous_name
http://cpsievert.github.io/plotly-test-table/R/dec99f1//labels-ylab
http://cpsievert.github.io/plotly-test-table/R/dec99f1//legend-iris-2traces-showlegend-FALSE
http://cpsievert.github.io/plotly-test-table/R/dec99f1//legend-iris-3traces-showlegend-FALSE
http://cpsievert.github.io/plotly-test-table/R/dec99f1//legend-iris-breaks
http://cpsievert.github.io/plotly-test-table/R/dec99f1//legend-iris-default
http://cpsievert.github.io/plotly-test-table/R/dec99f1//legend-iris-position-none
http://cpsievert.github.io/plotly-test-table/R/dec99f1//legend-iris-trace-showlegend-FALSE
http://cpsievert.github.io/plotly-test-table/R/dec99f1//linetype-colors
http://cpsievert.github.io/plotly-test-table/R/dec99f1//linetype-types
http://cpsievert.github.io/plotly-test-table/R/dec99f1//names
http://cpsievert.github.io/plotly-test-table/R/dec99f1//path-colored-groups-stay-together
http://cpsievert.github.io/plotly-test-table/R/dec99f1//path-colors
http://cpsievert.github.io/plotly-test-table/R/dec99f1//path-lines-diff-from-paths
http://cpsievert.github.io/plotly-test-table/R/dec99f1//path-line-symbols
http://cpsievert.github.io/plotly-test-table/R/dec99f1//polygon-aes-color
http://cpsievert.github.io/plotly-test-table/R/dec99f1//polygon-aes-fill
http://cpsievert.github.io/plotly-test-table/R/dec99f1//polygon-black
http://cpsievert.github.io/plotly-test-table/R/dec99f1//polygon-color-aes-fill
http://cpsievert.github.io/plotly-test-table/R/dec99f1//polygon-color-fill-aes-linetype
http://cpsievert.github.io/plotly-test-table/R/dec99f1//polygon-color-fill-aes-size
http://cpsievert.github.io/plotly-test-table/R/dec99f1//polygons-canada-borders
http://cpsievert.github.io/plotly-test-table/R/dec99f1//polygon-star-fill-color
http://cpsievert.github.io/plotly-test-table/R/dec99f1//polygon-star-group-color
http://cpsievert.github.io/plotly-test-table/R/dec99f1//polygon-star-group
http://cpsievert.github.io/plotly-test-table/R/dec99f1//rect-black4
http://cpsievert.github.io/plotly-test-table/R/dec99f1//rect-black
http://cpsievert.github.io/plotly-test-table/R/dec99f1//rect-color
http://cpsievert.github.io/plotly-test-table/R/dec99f1//rect-fill-color
http://cpsievert.github.io/plotly-test-table/R/dec99f1//rect-fill
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ribbon-alpha
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ribbon-colour
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ribbon-fill
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ribbon-group
http://cpsievert.github.io/plotly-test-table/R/dec99f1//scatterplots-color
http://cpsievert.github.io/plotly-test-table/R/dec99f1//scatterplots-full-range
http://cpsievert.github.io/plotly-test-table/R/dec99f1//scatterplots-hollow
http://cpsievert.github.io/plotly-test-table/R/dec99f1//scatterplots-jitter
http://cpsievert.github.io/plotly-test-table/R/dec99f1//scatterplots-loess
http://cpsievert.github.io/plotly-test-table/R/dec99f1//scatterplots-overlap
http://cpsievert.github.io/plotly-test-table/R/dec99f1//scatterplots-scale-color-hue
http://cpsievert.github.io/plotly-test-table/R/dec99f1//scatterplots-shape-manual
http://cpsievert.github.io/plotly-test-table/R/dec99f1//scatterplots-shape
http://cpsievert.github.io/plotly-test-table/R/dec99f1//scatterplots-smooth-lm
http://cpsievert.github.io/plotly-test-table/R/dec99f1//scatterplots-smooth-lm-se-false
http://cpsievert.github.io/plotly-test-table/R/dec99f1//segment
http://cpsievert.github.io/plotly-test-table/R/dec99f1//size-global-scaling
http://cpsievert.github.io/plotly-test-table/R/dec99f1//size-is-a-vector
http://cpsievert.github.io/plotly-test-table/R/dec99f1//size-not-a-vector
http://cpsievert.github.io/plotly-test-table/R/dec99f1//smooth-basic
http://cpsievert.github.io/plotly-test-table/R/dec99f1//smooth-colour2
http://cpsievert.github.io/plotly-test-table/R/dec99f1//smooth-colour
http://cpsievert.github.io/plotly-test-table/R/dec99f1//smooth-facet
http://cpsievert.github.io/plotly-test-table/R/dec99f1//smooth-fill2
http://cpsievert.github.io/plotly-test-table/R/dec99f1//smooth-group
http://cpsievert.github.io/plotly-test-table/R/dec99f1//smooth-se-false
http://cpsievert.github.io/plotly-test-table/R/dec99f1//stack
http://cpsievert.github.io/plotly-test-table/R/dec99f1//step-gg.hvh
http://cpsievert.github.io/plotly-test-table/R/dec99f1//step-gg.hv
http://cpsievert.github.io/plotly-test-table/R/dec99f1//step-gg.linear-geom_line
http://cpsievert.github.io/plotly-test-table/R/dec99f1//step-gg.linear-geom_path
http://cpsievert.github.io/plotly-test-table/R/dec99f1//step-gg.vh
http://cpsievert.github.io/plotly-test-table/R/dec99f1//step-gg.vhv
http://cpsievert.github.io/plotly-test-table/R/dec99f1//text-colour
http://cpsievert.github.io/plotly-test-table/R/dec99f1//text
http://cpsievert.github.io/plotly-test-table/R/dec99f1//theme-background
http://cpsievert.github.io/plotly-test-table/R/dec99f1//theme-dashed-grid-lines
http://cpsievert.github.io/plotly-test-table/R/dec99f1//theme-marker-default
http://cpsievert.github.io/plotly-test-table/R/dec99f1//theme-panel-border-1
http://cpsievert.github.io/plotly-test-table/R/dec99f1//theme-panel-border-2
http://cpsievert.github.io/plotly-test-table/R/dec99f1//theme-ticks-and-grids
http://cpsievert.github.io/plotly-test-table/R/dec99f1//theme-ticks-default
http://cpsievert.github.io/plotly-test-table/R/dec99f1//theme-zeroline-default
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-boxes-facet-grid
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-boxes
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-boxes-scales-free
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-boxes-space-free
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-breaks-less
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-breaks-more
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-breaks-nochange
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-discrete-order
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-evenly-spaced-ticks
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-flip
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-hide-ticks-labels
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-hide-ticks-lines-labels
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-hide-y-keep-grid
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-hide-y
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-limits-gap
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-limits-hide
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-scale-labels
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-ycontinuous-ranges
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-ylim-ranges
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-ylim-reversed-ranges
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-yreverse-limits-ranges
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ticks-yreverse-ranges
http://cpsievert.github.io/plotly-test-table/R/dec99f1//violin
http://cpsievert.github.io/plotly-test-table/R/dec99f1//vline-multiple
http://cpsievert.github.io/plotly-test-table/R/dec99f1//vline
http://cpsievert.github.io/plotly-test-table/R/dec99f1//ylim-one-trace

@cpsievert
Copy link
Collaborator

Looks great, thanks @13bzhang!

cpsievert added a commit that referenced this pull request Aug 7, 2015
@cpsievert cpsievert merged commit e883b0b into master Aug 7, 2015
@cpsievert cpsievert deleted the baobao-legend_position branch November 20, 2015 02:09
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.

2 participants