Images stored in folder in github app not displaying

[apk2150]

Hello,

I have tried to deploy an app that creates an html table and displays images in the table. The images are in a folder in the github but are not showing up in the table.

App: https://icsaburgeeformatter.streamlit.app/
Githhub: GitHub - apk2150/icsa_burgee_formatter

Thanks in advance!

[ferdy]

Can you post a minimal reproducible code?

[dataprofessor]

Hi @apk2150

As @ferdy suggested, sharing relevant minimum reproducible code snippets would help us in help you to diagnose the problem.

Based on the issue that you’re facing as mentioned in the post title, it seems your images that are hosted in your GitHub repo is not showing.

Here are some things that you can try:

• Make sure that the path is relative and enable the static file serving option as details in the following Docs page:
  Static file serving - Streamlit Docs
• Alternative, you can use the image URL link to display this in app. To get the link you can right click on the image that gets rendered on GitHub and you’ll get the following link (for out.png file):

https://github.com/apk2150/icsa_burgee_formatter/blob/master/out.png?raw=true

And going to this URL in the browser gives us:

https://raw.githubusercontent.com/apk2150/icsa_burgee_formatter/master/out.png

that we can then use in our app.

As for displaying images in an HTML table, you can check out the table_with_images method in streamlit-extras component:
https://arnaudmiribel.github.io/streamlit-extras/extras/image_in_tables/

Hope this helps!

[apk2150]

Using the image URLs from git hub was an easy fix. Thank you so much!