How to embed HTML into IPython output

Question

Is it possible to embed rendered HTML output into IPython output   One way is to use  from IPython core display import HTML HTML   lt a href  http   example com  gt link lt  a gt      or  IPython multiline cell alias     html  lt a href  http   example com  gt link lt  a gt    Which return a formatted link  but   This link doesn t open a browser with the webpage itself from the console  IPython notebooks support honest rendering  though  I m unaware of how to render HTML   object within  say  a list or pandas printed table  You can do df to html    but without making links inside cells  This output isn t interactive in the PyCharm Python console  because it s not QT     How can I overcome these shortcomings and make IPython output a bit more interactive

User · Answer

Some time ago Jupyter Notebooks started stripping JavaScript from HTML content [#3118]. Here are two solutions:

Serving Local HTML

If you want to embed an HTML page with JavaScript on your page now, the easiest thing to do is to save your HTML file to the directory with your notebook and then load the HTML as follows:

from IPython.display import IFrame

IFrame(src='./nice.html', width=700, height=600)

Serving Remote HTML

If you prefer a hosted solution, you can upload your HTML page to an Amazon Web Services "bucket" in S3, change the settings on that bucket so as to make the bucket host a static website, then use an Iframe component in your notebook:

from IPython.display import IFrame

IFrame(src='https://s3.amazonaws.com/duhaime/blog/visualizations/isolation-forests.html', width=700, height=600)

This will render your HTML content and JavaScript in an iframe, just like you can on any other web page:

_x000D_

<iframe src='https://s3.amazonaws.com/duhaime/blog/visualizations/isolation-forests.html', width=700, height=600></iframe>

_x000D_

User · Answer

First  the code  from random import choices  def random name length 6       return  quot  quot  join choices  quot abcdefghijklmnopqrstuvwxyz quot   k length     ---  from IPython display import IFrame  display  HTML import tempfile from os import unlink  def display html to frame html  width 600  height 600       name   f quot temp  random name    html quot      with open name   quot w quot   as f          print html  file f      display IFrame name  width  height   metadata dict isolated True         unlink name       def display html inline html       display HTML html  metadata dict isolated True     h  quot  lt html gt  lt b gt Hello lt  b gt  lt  html gt  quot      display html to iframe h  display html inline h   Some quick notes   You can generally just use inline HTML for simple items   If you are rendering a framework  like a large JavaScript visualization framework  you may need to use an IFrame   Its hard enough for Jupyter to run in a browser without random HTML embedded  The strange parameter  metadata dict isolated True  does not isolate the result in an IFrame  as older documentation suggests   It appears to prevent clear-fix from resetting everything   The flag is no longer documented   I just found using it allowed certain display  grid styles to correctly render  This IFrame solution writes to a temporary file   You could use a data uri as described here but it makes debugging your output difficult   The Jupyter IFrame function does not take a data or srcdoc attribute  The tempfile module creations are not sharable to another process  hence the random name    If you use the HTML class with an IFrame in it  you get a warning   This may be only once per session  You can use HTML  Hello   lt b gt world lt  b gt    at top level of cell and its return value will render   Within a function  use display HTML       as is done above   This also allows you to mix display and print calls freely  Oddly  IFrames are indented slightly more than inline HTML

User · Answer

Related  While constructing a class  def  repr html  self       can be used to create a custom HTML representation of its instances   class Foo      def  repr html  self           return  Hello  lt b gt World lt  b gt     o   Foo   o   will render as      Hello World    For more info refer to IPython s docs   An advanced example   from html import escape   Python 3 only  -   class Todo      def   init   self           self items           def add self  text  completed           self items append   text   text   completed   completed        def  repr html  self           return   lt ol gt    lt  ol gt   format    join   lt li gt       lt  li gt   format                  if item  completed   else                  escape item  text              for item in self items    my todo   Todo   my todo add  Buy milk   False  my todo add  Do homework   False  my todo add  Play video games   True   my todo   Will render             Buy milk       Do homework       Play video games

User · Answer

This seems to work for me   from IPython core display import display  HTML display HTML   lt h1 gt Hello  world  lt  h1 gt       The trick is to wrap it in  display  as well   Source  http   python 6 x6 nabble com Printing-HTML-within-IPython-Notebook-IPython-specific-prettyprint-tp5016624p5016631 html

User · Answer

Expanding on  Harmon above  looks like you can combine the display and print statements together     if you need  Or  maybe it s easier to just format your entire HTML as one string and then use display  Either way  nice feature   display HTML   lt h1 gt Hello  world  lt  h1 gt     print  Here s a link    display HTML   lt a href  http   www google com  target   blank  gt www google com lt  a gt     print  some more printed text       display HTML   lt p gt Paragraph text here     lt  p gt       Outputs something like this     Hello  world   Here s a link   www google com  some more printed text      Paragraph text here

User · Answer

to do this in a loop  you can do  display HTML  quot  quot  join  f quot  lt a href   url   gt  url  lt  a gt  lt  br gt  quot  for url in urls      This essentially creates the html text in a loop  and then uses the display HTML     construct to display the whole string as HTML

[python] How to embed HTML into IPython output?

Examples related to python

Examples related to html

Examples related to ipython

Examples related to jupyter-notebook