Output Examples

This notebook is designed to provide examples of different types of outputs that can be used to test the JupyterLab frontend and other Jupyter frontends.



In [1]:

    
from IPython.display import display
from IPython.display import HTML, Image, Latex, Math, Markdown, SVG

Text

Plain text:



In [2]:

    
text = """Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam urna
libero, dictum a egestas non, placerat vel neque. In imperdiet iaculis fermentum. 
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia 
Curae; Cras augue tortor, tristique vitae varius nec, dictum eu lectus. Pellentesque 
id eleifend eros. In non odio in lorem iaculis sollicitudin. In faucibus ante ut 
arcu fringilla interdum. Maecenas elit nulla, imperdiet nec blandit et, consequat 
ut elit."""
print(text)









    



Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam urna
libero, dictum a egestas non, placerat vel neque. In imperdiet iaculis fermentum. 
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia 
Curae; Cras augue tortor, tristique vitae varius nec, dictum eu lectus. Pellentesque 
id eleifend eros. In non odio in lorem iaculis sollicitudin. In faucibus ante ut 
arcu fringilla interdum. Maecenas elit nulla, imperdiet nec blandit et, consequat 
ut elit.

Text as output:



In [3]:

    
text









    Out[3]:





'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam urna\nlibero, dictum a egestas non, placerat vel neque. In imperdiet iaculis fermentum. \nVestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia \nCurae; Cras augue tortor, tristique vitae varius nec, dictum eu lectus. Pellentesque \nid eleifend eros. In non odio in lorem iaculis sollicitudin. In faucibus ante ut \narcu fringilla interdum. Maecenas elit nulla, imperdiet nec blandit et, consequat \nut elit.'

Standard error:



In [4]:

    
import sys; print('this is stderr', file=sys.stderr)









    



this is stderr

HTML



In [5]:

    
div = HTML('<div style="width:100px;height:100px;background:grey;" />')
div









    Out[5]:



In [6]:

    
for i in range(3):
    print(10**10)
    display(div)









    



10000000000






    











    



10000000000






    











    



10000000000

Markdown



In [7]:

    
md = Markdown("""
### Subtitle

This is some *markdown* text with math $F=ma$.

""")
md









    Out[7]:




Subtitle
This is some markdown text with math $F=ma$.



In [8]:

    
display(md)









    




Subtitle
This is some markdown text with math $F=ma$.

LaTeX

Examples LaTeX in a markdown cell:

\begin{align} \nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\ \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\ \nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\ \nabla \cdot \vec{\mathbf{B}} & = 0 \end{align}



In [9]:

    
math = Latex("$F=ma$")
math









    Out[9]:





$F=ma$



In [10]:

    
maxwells = Latex(r"""
\begin{align}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} & = 0
\end{align}
""")
maxwells









    Out[10]:






\begin{align}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} & = 0
\end{align}

Image



In [11]:

    
img = Image("https://apod.nasa.gov/apod/image/1707/GreatWallMilkyWay_Yu_1686.jpg")
img









    Out[11]:

Set the image metadata:



In [12]:

    
img2 = Image(
    "https://apod.nasa.gov/apod/image/1707/GreatWallMilkyWay_Yu_1686.jpg",
    width=100,
    height=200
)
img2









    Out[12]:

SVG



In [13]:

    
svg_source = """
<svg width="400" height="110">
  <rect width="300" height="100" style="fill:#E0E0E0;" /> 
</svg>
"""
svg = SVG(svg_source)
svg









    Out[13]:



In [14]:

    
for i in range(3):
    print(10**10)
    display(svg)









    



10000000000






    











    



10000000000






    











    



10000000000



In [ ]: