mark roche
mark roche

Reputation: 31

Broken Image Links in Markdown

I am working on the .md file in the following location:

https://github.com/markroche92/SDND-Traffic-Sign-Classification/blob/master/writeup_template.md

None of my linked images are appearing when I view the .md file in Github. I have used the following markdown code to attempt to link the images:

---

**Build a Traffic Sign Recognition Project**

[//]: # (Image References)

[image1]: ./histogram_input_data.png "Input_Data"
[image2]: ./Label26.png "Label_26"
[image3]: ./Label36.png "Label_36"
[image4]: ./Label41.png "Label_41"
[image5]: ./channels.png "Channels"
[image6]: ./nn_results.png "NN_Results"
[image7]: ./GermanRoadSigns/x32/132.jpg "Img_1"
[image8]: ./GermanRoadSigns/x32/232.jpg "Img_2"
[image9]: ./GermanRoadSigns/x32/332.jpg "Img_3"
[image10]: ./GermanRoadSigns/x32/432.jpg "Img_4"
[image11]: ./GermanRoadSigns/x32/532.jpg "Img_5"
[image12]: ./int_ims.png "Performance"
[image13]: ./top_five_predictions.png "Top_Five_Predictions"
[image14]: ./structure.jpg "Network_structure"

---

...

The following histogram shows the distribution of training, validation and 
test set images per label:

![alt text][image1]

An example image was visualised for each label. Three are displayed below:

![alt text][image2]
![alt text][image3]
![alt text][image4]


Each image has three channels (red, green, blue). The three channels are 
visualized below for an example image:

![alt text][image5]

However, none of the images seem to be appearing when .md is viewed on Github. Can anyone show me where I am going wrong here?

Upvotes: 3

Views: 3089

Answers (2)

NickC
NickC

Reputation: 377

I also had this issue on some of my images, but not others. It ended up being how I capitalized my image names in my markdown file. For example:

Image name on my computer: oneGreatImage.png

Image name in my Markdown file: onegreatImage.png

When I capitalized the G again and pushed the changes it loaded just fine. It appears that GitHub is VERY picky about matching the filenames on the images so double check that.

Upvotes: 0

Crissov
Crissov

Reputation: 1059

In the actual .md file you are not using relative URLs like in your supposed quote, but absolute ones like this:

https://github.com/markroche92/SDND-Traffic-Sign-Classification/blob/master/structure.JPG

This won’t work because it is actually a standard GitHub file page, not the image itself. To link to the image, remove /blob from the path and change the domain to rawgit.com – or actually use relative URLs with or without leading ./, but make sure to get the letter case right.

https://rawgit.com/markroche92/SDND-Traffic-Sign-Classification/master/structure.JPG
structure.JPG

Upvotes: 1

Related Questions