GitHub ReadMe.md Showing Some Images but not Others

So I was working on a little personal project with lots of pretty graphs in Jupyter Notebook. I made a .ipynb markdown file to make the ReadMe, since I can actually view the rReadMe as it will appear in the .md file when I move it over to GitHub, and it all worked fine and dandy.

And then I transferred it all to GitHub, and for some reason, 5 of the 7 graphs are refusing to appear.

https://github.com/nmwhitehead/Healthcare-Costs

If you can't view the code in the Read Me.ipnyb file, you'll have to take me work that all of the images would input with the same format of <img src='Graphs/Healthcare_Cost.png'/>. Every time I search how to fix this problem, everything says it's gotta be a formatting thing, but <img src='Graphs/50%_Predictor.png'/> is the same format and it's not appearing and I am losing my mind here.

Upvotes: 1

Views: 282

Answers (2)

Schwern
Schwern

Reputation: 164639

% is a URL metacharacter and needs to be escaped. It lets you represent any ASCII character by following with the hex representation of an ASCII character. You use it to represent metacharacters like a space %20 or / as %2f or % as %25.

https://github.com/nmwhitehead/Healthcare-Costs/raw/master/Graphs/50%_Predictor.png means... well %_P is nonsense. Though some servers might accept it as a literal %_P, Github is following the standard and does not. The URL has incorrect syntax so you're getting a 400 Bad Request.

The % needs to be encoded as %25. https://raw.githubusercontent.com/nmwhitehead/Healthcare-Costs/master/Graphs/50%25_Predictor.png

It's probably best to avoid this gotcha and rename the files. 50pct_Predictor.png, for example.

Upvotes: 1

GoodDeeds
GoodDeeds

Reputation: 8497

Your files contain a % symbol in their name. This file name is simply copied in the URL link of the image.

However, in URL encoding, the percent symbol is special. You need to use %25 in place of %. Doing so in the URL fixes the link.

Upvotes: 2

Related Questions