Images as x-axis labels

Open-source software is awesome. If I found that a piece of closed-source software was missing a feature that I wanted, well, bad luck. I probably couldn‘t even tell if was actually missing or if I just didn‘t know about it. When the source is available, maintained, and documented however, things get fun. We can identify, and perhaps fill gaps.

I‘ve thought for a couple of projects which had bar-graphs that it would be neat to have the categories labelled by an icon or a picture. Say, the logo for a company or an illustrative example. Sure, you could fire up GIMP/Inkscape and manually insert them over the top of the text labels (each and every time you re-produce the graph... no thanks) but that‘s not how I operate.

There are probably very few cases for which this is technically a good idea (trying to be a featured author on JunkCharts might very well be one of those reasons). Nonetheless, there are at least a couple of requests for this floating around on stackoverflow; here and here for example. I struggled to find any satisfactory solutions that were in current working order (though perhaps my Google-fu has failed me).

The second link there has a working example, but the big update to ggplot2 breaks that pretty strongly; opts was deprecated and now element_text() has a gatekeeper validation routine that prevents any such messing around. The first link however takes a different route. I couldn‘t get that one to work either, but in any case the answer is a year out of date (updates in ggplot2can easily have broken the gTree relations), not particularly flexible, and relies on saving intermittent image files for PostScriptTrace to read back in which I‘m not a fan of (and couldn‘t get to work anyway).

I decided that I perhaps had enough ammunition to hack something together myself (emphasis on hack), and sure enough it seems to have worked (for a limited definition of "worked" with no attached or implied guarantees whatsoever).

GDP per capita with flags for x-axis labels. This was harder to make than it seemed, but I‘ve since added a little more flexibility to it.

The way to go about making your own is as follows;

    1. Stop and carefully re-evaluate the choices that you‘ve made to bring you to this decision. Are you sure? Okay...
    2. Save the images (in the correct factor order) into a list (e.g. pics).
    3. Build your bar graph with categorical x-axis as per normal, using theme() to remove the labels. Save as an object (e.g. g).
    4. Source the function from this gist (at your own risk... copy and paste if you prefer):

devtools::source_gist("1d1bdb00a7b3910d62bf3eec8a77b4a7")

  #‘ Replace categorical x-axis labels with images
  #‘
  #‘ Pipe a ggplot2 graph (with categorical x-axis) into this function with the argument of a list of
  #‘ pictures (e.g. loaded via readImage) and it builds a new grob with the x-axis categories
  #‘ now labelled by the images. Solves a problem that you perhaps shouldn‘t have.
  #‘
  #‘ @author J. Carroll, \email{[email protected]@jcarroll.com.au}
  #‘ @references \url{http://stackoverflow.com/questions/29939447/icons-as-x-axis-labels-in-r-ggplot2}
  #‘
  #‘ @param g ggplot graph with categorical x axis
  #‘ @param pics ordered list of pictures to place along x-axis
  #‘
  #‘ @return NULL (called for the side-effect of producing a new grob with images for x-axis labels)
  #‘
  #‘ @import grid
  #‘ @import ggplot2
  #‘
  #‘ @export
  #‘
  #‘ @example
  #‘ \dontrun{ggplot(data, aes(x=factor(x),y=y)) + geom_point() %>% add_images_as_xlabels(pics)}
  #‘
  add_images_as_xlabels <- function(g, pics) {
   
  ## ensure that the input is a ggplot
  if(!inherits(g, "ggplot")) stop("Requires a valid ggplot to attach images to.")
   
  ## extract the components of the ggplot
  gb <- ggplot_build(gg)
  xpos <- gb$panel$ranges[[1]]$x.major
  yrng <- gb$panel$ranges[[1]]$y.range
   
  ## ensure that the number of pictures to use for labels
  ## matches the number of x categories
  if(length(xpos) != length(pics)) stop("Detected a different number of pictures to x categories")
   
  ## create a new grob of the images aligned to the x-axis
  ## at the categorical x positions
  my_g <- do.call("grobTree", Map(rasterGrob, pics, x=xpos, y=0))
   
  ## annotate the original ggplot with the new grob
  gg <- gg + annotation_custom(my_g,
  xmin = -Inf,
  xmax = Inf,
  ymax = yrng[1] + 0.25*(yrng[2]-yrng[1])/npoints,
  ymin = yrng[1] - 0.50*(yrng[2]-yrng[1])/npoints)
   
  ## turn off clipping to allow plotting outside of the plot area
  gg2 <- ggplotGrob(gg)
  gg2$layout$clip[gg2$layout$name=="panel"] <- "off"
   
  ## produce the final, combined grob
  grid.newpage()
  grid.draw(gg2)
   
  return(invisible(NULL))
   
  }

view rawadd_images_as_xlabels.R hosted with  by GitHub

    1. Call (or pipe your ggplot object to) the function:

g %>% add_images_as_xlabels(pics)

## or

add_images_as_xlabels(g, pics)

  1. Your image will be re-drawn with your pictures labelling the categories.

Here‘s an example of the code used to generate the GDP per capita image, featuring some fairly brief (for what it does) rvest scraping (to reiterate; I don‘t want to have to do any of this by hand, so let‘s code it up!).

  library(rvest)
   
  ## GDP per capita, top 10 countries
  url <- "https://en.wikipedia.org/wiki/List_of_countries_by_GDP_(nominal)_per_capita"
  html <- read_html(url)
  gdppc <- html_table(html_nodes(html, "table")[3])[[1]][1:10,]
   
  ## clean up; remove non-ASCII and perform type conversions
  gdppc$Country <- gsub("Â ", "", gdppc$Country)
  gdppc$Rank <- iconv(gdppc$Rank, "latin1", "ASCII", sub="")
  gdppc$Country <- iconv(gdppc$Country, "latin1", "ASCII", sub="")
  gdppc$`US$` <- as.integer(sub(",", "", gdppc$`US$`))
   
  ## flag images (yes, this processing could be done neater, I‘m sure)
  ## get the 200px versions
  flags_img <- html_nodes(html_nodes(html, "table")[3][[1]], "img")[1:10]
  flags_url <- paste0(‘http://‘, sub(‘[0-9]*px‘, ‘200px‘, sub(‘\\".*$‘, ‘‘, sub(‘^.*src=\\"//‘, ‘‘, flags_img))))
  flags_name <- sub(‘.*(Flag_of)‘, ‘\\1‘, flags_url)
   
  if(!dir.exists("flags")) dir.create("flags")
  for(flag in seq_along(flags_url)) {
  switch(Sys.info()[[‘sysname‘]],
  Windows= {download.file(flags_url[flag], destfile=file.path("flags", paste0(flag,"_", flags_name[flag])), method="auto", mode="wb")},
  Linux = {download.file(flags_url[flag], destfile=file.path("flags", paste0(flag,"_", flags_name[flag])))},
  Darwin = {print("Not tested on Mac. Use one of the above and find out?")})
  }
   
  library(EBImage) ## readImage
  library(dplyr) ## %>%
  library(ggplot2) ## devtools::install_github("hadley/ggplot2)
  library(grid) ## rasterGrob
  library(ggthemes) ## theme_minimal
  library(scales) ## comma
   
  ## create a dummy dataset
  npoints <- length(flags_name)
  y <- gdppc$`US$`
  x <- seq(npoints)
  dat <- data.frame(x=factor(x), y=y)
   
  ## load the images from filenames
  ## one day I‘ll remember to make these sorted on save
  pics <- vector(mode="list", length=npoints)
  image.file <- dir("flags", full.names=TRUE)
  image.file <- image.file[order(as.integer(sub("_.*", "", sub("flags/", "", image.file))))]
   
  ## save the images into a list
  for(i in 1:npoints) {
  pics[[i]] <- EBImage::readImage(image.file[i])
  }
   
  ## create the graph, as per normal
  ## NB: #85bb65 is the color of money in the USA apparently.
  gg <- ggplot(dat, aes(x=x, y=y/1e3L, group=1))
  gg <- gg + geom_bar(col="black", fill="#85bb65", stat="identity")
  gg <- gg + scale_x_discrete()
  gg <- gg + theme_minimal()
  gg <- gg + theme(plot.margin = unit(c(0.5,0.5,5,0.5), "lines"),
  axis.text.x = element_blank(),
  axis.text.y = element_text(size=14))
  gg <- gg + scale_fill_discrete(guide=FALSE)
  gg <- gg + theme(plot.background = element_rect(fill="grey90"))
  gg <- gg + labs(title="GDP per Capita", subtitle=paste0("Top 10 countries\n(", url, ")"), x="", y="$US/1000")
  gg
   
  ## insert imags (pics) as x-axis labels
  ## well, at least appear to do so
  gg %>% add_images_as_xlabels(pics)

view rawGDP_per_capita.R hosted with  by GitHub

At least a few caveats surround what I did manage to get working, including but not limited to:

  • I‘m not sure how to put the x-axis title back in at the right position without padding it with a lot of linebreaks ("\n\n\n\nX-AXIS TITLE").
  • I‘m not sure how to move the caption line from labs() (assuming you‘re using the development version of ggplot2 on GitHub with @hrbrmstr‘s excellent annotation additions) so it potentially gets drawn over.
  • The spacing below the graph is currently arbitrarily set to a few lines more than necessary, but it‘s a compromise in having an arbitrary number of images loaded at their correct sizes.
  • Similarly, I‘ve just expanded the plot range of the original graph by a seemingly okay amount which has worked for the few examples I‘ve tried.
  • Using a graph like this places the onus of domain knowledge onto the reader; if you don‘t know what those flags refer to then this graph is less useful than one with the countries labelled with words. Prettier though.

I‘ve no doubt that there must be a better way to do this, but it‘s beyond my understanding of how ggproto works, and I can‘t seem to bypass element_text‘s requirements with what I do know. If you would like to help develop this into something more robust then I‘m most interested. Given that it‘s a single function I wasn‘t going to create a package just for this, but I‘m willing to help incorporate it into someone‘s existing package. Hit the comments or ping me on Twitter (@carroll_jono)!

转自:http://jcarroll.com.au/2016/06/02/images-as-x-axis-labels/

时间: 2024-08-04 15:37:03

Images as x-axis labels的相关文章

TeeChart中Axis的CalcIncrement属性

private void Init() { tChart = new TChart(); panel1.Controls.Add(tChart); tChart.Aspect.View3D = false; tChart.Dock = DockStyle.Fill; Line line = new Line(); tChart.Series.Add(line); //double[] array = {13.676251, 13.676252, 13.676254, 13.676251, 13.

DataFrame

Constructor DataFrame([data, index, columns, dtype, copy]) Two-dimensional size-mutable, potentially heterogeneous tabular data structure with labeled axes (rows and columns). Axes index: row labels columns: column labels DataFrame.as_matrix([columns

pandas.DataFrame.plot

pandas.DataFrame.plot¶ DataFrame.plot(x=None, y=None, kind='line', ax=None, subplots=False, sharex=None, sharey=False, layout=None, figsize=None, use_index=True, title=None, grid=None, legend=True, style=None, logx=False, logy=False, loglog=False, xt

Matlab绘图基本控制命令

图形的控制与表现 (Figure control and representation) MATLAB提供的用于图形控制的函数和命令:   axis:  人工选择坐标轴尺寸.    clf:清图形窗口. ginput: 利用鼠标的十字准线输入.   hold: 保持图形.    shg:显示图形窗口.subplot: 将图形窗口分成N块子窗口.1.图形窗口(figure window)(1). 图形窗口的创建和选择(Creating and selecting of figure window)

Pandas Api 不完全翻译

原文地址 http://pandas.pydata.org/pandas-docs/stable/api.html API Reference Input/Output Pickling read_pickle(path) Load pickled pandas object (or any other pickled object) from the specified Flat File read_table(filepath_or_buffer[, sep, ...]) Read gene

ChartDirector 报表操作

ChartDirector 报表操作 http://ww.evget.com/product/515/download下载到 .Net 的试用版,里面有所有的demo和帮助文档(那个什么软件不用管,有demo就行,).    本人乃新手,也没做过报表,网上随便找的下载地址,可惜文档全是英文,不过幸好有demo,也是嫌demo页面多,不知到哪个页面干啥的,索性就截了下图和简单标明了一下(可以根据页面名字知道其作用的,可惜本人是英语盲),图片很小莫怪,本人只是看个大概即可,具体还是得把demo都看一

Pandas 10min入门(官方文档注释版一)

接触Pandas有一段时间,但一直未能系统的进行过总结.最近开始接触机器学习,用pandas的地方颇多,因此专门重新整理以下. 首先,Pandas 作为Python处理矩阵类数据的王牌利器,其官方文档相当丰富而且详细,为了方便学习Pandas官方竟然给了一个10min中的入门教程,链接如下:http://pandas.pydata.org/pandas-docs/stable/10min.html . 教程很详细,但是对于入门者而言,个人感觉还是缺少一些说明.因此特意增加了一些相关的注释和说明.

利用python进行数据分析——histogram

DataFrame.hist(data, column=None, by=None, grid=True, xlabelsize=None, xrot=None, ylabelsize=None, yrot=None,ax=None, sharex=False, sharey=False, figsize=None, layout=None, bins=10, **kwds) data : DataFrame column : string or sequence 字符串或序列 by : obj

一篇文章,带你明白什么是过拟合,欠拟合以及交叉验证

误差模型:过拟合,交叉验证,偏差-方差权衡 作者Natasha Latysheva;Charles Ravarani 发表于cambridgecoding 介绍 ??在本文中也许你会掌握机器学习中最核心的概念:偏差-方差权衡.其主要想法是,你想创建尽可能预测准确并且仍能适用于新数据的模型(这是泛化).危险的是,你可以轻松的在你制定的数据中创建过度拟合本地噪音的模型,这样的模型是无用的,并且导致弱泛化能力,因为噪声是随机的,故而在每个数据集中是不同的.从本质上讲,你希望创建仅捕获数据集中有用成份的

C#数据库和ZEDGRAPH曲线绘制多线程操作

硬件是STM32: 软件开发环境是VS2012 通讯方式:SERIAL PC界面主要是曲线绘制以及数据库的操作 上传部分多线程代码 1 using System; 2 using System.Collections.Generic; 3 using System.ComponentModel; 4 using System.Data; 5 using System.Drawing; 6 using System.Linq; 7 using System.Text; 8 using System