14

In my notebook, I can display image in markdown from the same folder like this:

<img src="files/adaptive_filter.png" alt="Schema of adaptive filter" height="100">

If I use the code without the files/ in src it does not work.

Now I changed the image and the ipython notebook is still showing the original one. I try to remove it from code and restart the notebook, it does not help.

What I should do? Are the images stored somewhere?

Thanks in advance.

Thomas K
  • 39,200
  • 7
  • 84
  • 86
matousc
  • 3,698
  • 10
  • 40
  • 65

5 Answers5

9

I ran into this problem as well, where I was using a class of my own to output some python plots and embed them in an IPython notebook. A hack way to solve this would be to add a random argument to the end of your image url. For example

<img src="files/adaptive_filter.png?1" alt="Schema of adaptive filter" height="100">

will not be cached in the same place as 

<img src="files/adaptive_filter.png?2" alt="Schema of adaptive filter" height="100">

A programatic way to do this would be to include the picture via python, instead of markdown, for instance:

# pick a random integer with 1 in 2 billion chance of getting the same
# integer twice
import random
__counter__ = random.randint(0,2e9)

# now use IPython's rich display to display the html image with the
# new argument
from IPython.display import HTML, display
display(HTML('<img src="files/adaptive_filter.png?%d" ' +
             'alt="Schema of adaptive filter" ' +
             'height="100">' % __counter__))

Should update the image everytime you run the code cell

ahagen
  • 600
  • 6
  • 13
5

I ran into exactly the same problem. The following procedure works for me:

In the folder where your .ipynb file resides, there is a cache directory called .ipynb_checkpoints/. There should be a file in that cache directory that has the same file name as the one you are working on. Now remove/delete that cache file in the .ipynb_checkpoint/ directory then reload the browser. You should be able to see the updated image.

My environment: macOS 10.14.2, Chrome browser 71.0, and Jupyter 1.0.0 installed through anaconda.

Hope this helps.

RandomWalker
  • 765
  • 1
  • 7
  • 10
2

I had the same problem of images caching in jupyter and not updating when the file is modified when using matplotlib.pyplot. I fixed it by using IPython.display.Image

from IPython.display import Image
def saveImage(path, show=True): 
    plt.savefig(path, facecolor="white", bbox_inches='tight') 
    if show: return Image(path)

Then at the end of a code cell, something like saveImage('./someImage.png') will save and display an image.

Similarly Image('./someImage.png') will display an image from disk (without saving).

This seems to avoid caching issues, and the image displays in PDF exports correctly (see also Jupyter notebook matplotlib figures missing in exported pdf for the answer this is based on).

In my case, it helped reduce the size of the jupyter notebook, preventing it from crashing when rendering and updating matplotlib.pyplot charts.

phhu
  • 1,462
  • 13
  • 33
1

I am using the Jupyter notebook VSCode extension, and I don't see any .ipynb_checkpoints directory. What works instead is the VSCode command Python: Clear Cache and Reload Window, but as stated it reloads the entire view. Beware of what data it might clear...

Warpig
  • 73
  • 8
0

  1. In ipynb file directory,use ls command ,it will display a hidden directory .ipynb_checkpoints

  2. Delete the .ipynb_checkpoints directory ,then rerun the cell code,you will see the newest image.

HobbyMarks
  • 348
  • 2
  • 5