error when annotating axis labels with custom images in ggplot/ggtext-CodePudding

I am trying to annotate a plot by including custom images as the labels for a discrete x axis.

I have used the package ggtext which adds this functionality to ggplot, and while I am able to replicate the example provided in the documentation of ggtext fior the iris datase, as son as i stat using custom images, either from a link or reading them from file i stat getting errors which i cannot seems to solve. I have tried converting the image to different formats still no success.

here is an example with my custom images


labels <- c(
  setosa = "<img src='https://github.com/hcuve/halo_faces/blob/main/ggtextimgs/comp1.JPG'
    width='100' /><br>*I. *",
  virginica = "<img src='https://github.com/hcuve/halo_faces/blob/main/ggtextimgs/comp2.JPG'
    width='100' /><br>*I. *",
  versicolor = "<img src='https://github.com/hcuve/halo_faces/blob/main/ggtextimgs/comp3.JPG'
    width='100' /><br>*I. *"
)


ggplot(iris, aes(Species, Sepal.Width))  
  geom_boxplot()  
  scale_x_discrete(
    name = NULL,
    labels = labels
  )  
  theme(
    axis.text.x = element_markdown(color = "black", size = 11)
  )

this throws the following error: Error in jpeg::readJPEG(get_file(path), native = TRUE) : JPEG decompression error: Not a JPEG file: starts with 0x0a 0x0a

CodePudding user response：

When you copy the link of the download button of each image on Github, you can see that the link is different. That's why you are getting an error. Here is a reproducible example with the right URLs:

labels <- c(
  setosa = "<img src='https://github.com/hcuve/halo_faces/raw/main/ggtextimgs/comp1.png'
    width='100' /><br>*I. *",
  virginica = "<img src='https://github.com/hcuve/halo_faces/raw/main/ggtextimgs/comp2.png'
    width='100' /><br>*I. *",
  versicolor = "<img src='https://github.com/hcuve/halo_faces/raw/main/ggtextimgs/comp3.png'
    width='100' /><br>*I. *"
)

library(ggtext)
library(ggplot2)
ggplot(iris, aes(Species, Sepal.Width))  
  geom_boxplot()  
  scale_x_discrete(
    name = NULL,
    labels = labels
  )  
  theme(
    axis.text.x = element_markdown(color = "black", size = 11)
  )

^{Created on 2022-12-27 with reprex v2.0.2}

CodePudding user response：

It looks like the issue might be with the URLs of the images you're trying to use. The URLs you've provided point to the raw contents of the image files hosted on GitHub, but these URLs don't seem to be properly formatted for displaying the images in your plot.

To display images from URLs in ggplot2, you need to use the correct URL for the image file itself, rather than the URL for the file's raw content. To get the correct URL for an image hosted on GitHub, you can go to the page for the image file on GitHub, click on the image to view it in the browser, and then copy the URL of the page from the address bar of your browser. This URL should be in the following format:

https://github.com/USERNAME/REPO/blob/BRANCH/FILENAME

You can then use this URL as the src attribute in an tag in your ggplot2 labels.

For example, to display the comp1.JPG image in your plot, you would use the following tag in the labels vector:

setosa = "<img src='https://github.com/USERNAME/REPO/blob/BRANCH/ggtextimgs/comp1.JPG' width='100' /><br>*I. *"

Make sure to replace USERNAME, REPO, and BRANCH with the correct values for your repository.

I hope this helps!