<SYSTEM_TASK:>
Given the following text description, write Python code to implement the functionality described below step by step
<END_TASK>
<USER_TASK:>
Description:
 This notebook is part of the nbsphinx documentation
Step1:  A simple output
Step2:  The standard output stream
Step3:  Normal output + standard output
Step4:  The standard error stream is highlighted and displayed just below the code cell.
The standard output stream comes afterwards (with no special highlighting).
Finally, the "normal" output is displayed.
Step5:  <div class="alert alert-info">
Note
Using the IPython kernel, the order is actually mixed up,
see https
Step6:  Special Display Formats
See IPython example notebook.
Local Image Files
Step7:  See also SVG support for LaTeX.
Step8:  Image URLs
Step9:  Math
Step10:  Plots
The output formats for Matplotlib plots can be customized
via the IPython configuration file ipython_kernel_config.py.
This file can be either
in the directory where your notebook is located
(see the ipython_kernel_config.py in this directory),
or in your profile directory
(typically ~/.ipython/profile_default/ipython_kernel_config.py).
To find out your IPython profile directory, use this command
Step11:  Alternatively, the figure format(s) can also be chosen directly in the notebook
(which overrides the setting in nbsphinx_execute_arguments and in the IPython configuration)
Step12:  If you want to use PNG images, but with HiDPI resolution,
use the special 'png2x' (a.k.a. 'retina') format
(which also looks nice in the LaTeX output)
Step13:  Pandas Dataframes
Pandas dataframes
should be displayed as nicely formatted HTML tables (if you are using HTML output).
Step14:  For LaTeX output, however, the plain text output is used by default.
To get nice LaTeX tables, a few settings have to be changed
Step15:  This is not enabled by default because of
Pandas issue #12182.
The generated LaTeX tables utilize the booktabs package, so you have to make sure that package is loaded in the preamble with
Step16:  The longtable package is already used by Sphinx,
so you don't have to manually load it in the preamble.
Finally, if you want to use LaTeX math expressions in your dataframe, you'll have to disable escaping
Step17:  The above settings should have no influence on the HTML output, but the LaTeX output should now look nicer
Step19:  Markdown Content
Step20:  YouTube Videos
Step21:  Interactive Widgets (HTML only)
The basic widget infrastructure is provided by
the ipywidgets module.
More advanced widgets are available in separate packages,
see for example https
Step22:  A widget typically consists of a so-called "model" and a "view" into that model.
If you display a widget multiple times,
all instances act as a "view" into the same "model".
That means that their state is synchronized.
You can move either one of these sliders to try this out
Step23:  You can also link different widgets.
Widgets can be linked via the kernel
(which of course only works while a kernel is running)
or directly in the client
(which even works in the rendered HTML pages).
Widgets can be linked uni- or bi-directionally.
Examples for all 4 combinations are shown here
Step24:  <div class="alert alert-info">
Other Languages
The examples shown here are using Python,
but the widget technology can also be used with
different Jupyter kernels
(i.e. with different programming languages).
</div>
Troubleshooting
To obtain more information if widgets are not displayed as expected, you will need to look at the error message in the web browser console.
To figure out how to open the web browser console, you may look at the web browser documentation
Step25:  Unsupported Output Types
If a code cell produces data with an unsupported MIME type, the Jupyter Notebook doesn't generate any output.
nbsphinx, however, shows a warning message.
Step26:  ANSI Colors
The standard output and standard error streams may contain ANSI escape sequences to change the text and background colors.
Step27:  The following code showing the 8 basic ANSI colors is based on https
Step28:  ANSI also supports a set of 256 indexed colors.
The following code showing all of them is based on http
Step29:  You can even use 24-bit RGB colors
<ASSISTANT_TASK:>
Python Code:
# 2 empty lines before, 1 after
Explanation: This notebook is part of the nbsphinx documentation: https://nbsphinx.readthedocs.io/.
Code Cells
Code, Output, Streams
An empty code cell:
Two empty lines:
Leading/trailing empty lines:
End of explanation
6 * 7
Explanation: A simple output:
End of explanation
print('Hello, world!')
Explanation: The standard output stream:
End of explanation
print('Hello, world!')
6 * 7
Explanation: Normal output + standard output
End of explanation
import sys
print("I'll appear on the standard error stream", file=sys.stderr)
print("I'll appear on the standard output stream")
"I'm the 'normal' output"
Explanation: The standard error stream is highlighted and displayed just below the code cell.
The standard output stream comes afterwards (with no special highlighting).
Finally, the "normal" output is displayed.
End of explanation
%%bash
for i in 1 2 3
do
    echo $i
done
Explanation: <div class="alert alert-info">
Note
Using the IPython kernel, the order is actually mixed up,
see https://github.com/ipython/ipykernel/issues/280.
</div>
Cell Magics
IPython can handle code in other languages by means of cell magics:
End of explanation
from IPython.display import Image
i = Image(filename='images/notebook_icon.png')
i
display(i)
Explanation: Special Display Formats
See IPython example notebook.
Local Image Files
End of explanation
from IPython.display import SVG
SVG(filename='images/python_logo.svg')
Explanation: See also SVG support for LaTeX.
End of explanation
Image(url='https://www.python.org/static/img/python-logo-large.png')
Image(url='https://www.python.org/static/img/python-logo-large.png', embed=True)
Image(url='https://jupyter.org/assets/homepage/main-logo.svg')
Explanation: Image URLs
End of explanation
from IPython.display import Math
eq = Math(r'\int\limits_{-\infty}^\infty f(x) \delta(x - x_0) dx = f(x_0)')
eq
display(eq)
from IPython.display import Latex
Latex(r'This is a \LaTeX{} equation: $a^2 + b^2 = c^2$')
%%latex
\begin{equation}
\int\limits_{-\infty}^\infty f(x) \delta(x - x_0) dx = f(x_0)
\end{equation}
Explanation: Math
End of explanation
import matplotlib.pyplot as plt
fig, ax = plt.subplots(figsize=[6, 3])
ax.plot([4, 9, 7, 20, 6, 33, 13, 23, 16, 62, 8]);
Explanation: Plots
The output formats for Matplotlib plots can be customized
via the IPython configuration file ipython_kernel_config.py.
This file can be either
in the directory where your notebook is located
(see the ipython_kernel_config.py in this directory),
or in your profile directory
(typically ~/.ipython/profile_default/ipython_kernel_config.py).
To find out your IPython profile directory, use this command:
python3 -m IPython profile locate
A local ipython_kernel_config.py in the notebook directory
also works on https://mybinder.org/.
Alternatively, you can create a file with those settings in a file named
.ipython/profile_default/ipython_kernel_config.py in your repository.
If you want to use SVG images for Matplotlib plots,
add this line to your IPython configuration file:
python
c.InlineBackend.figure_formats = {'svg'}
If you want SVG images, but also want nice plots when exporting to LaTeX/PDF, you can select:
python
c.InlineBackend.figure_formats = {'svg', 'pdf'}
If you want to use the default PNG plots or HiDPI plots using 'png2x' (a.k.a. 'retina'),
make sure to set this:
python
c.InlineBackend.rc = {'figure.dpi': 96}
This is needed because the default 'figure.dpi' value of 72
is only valid for the Qt Console.
If you are planning to store your SVG plots as part of your notebooks,
you should also have a look at the 'svg.hashsalt' setting.
For more details on these and other settings, have a look at
Default Values for Matplotlib's "inline" Backend.
If you for some reason can't use a ipython_kernel_config.py file,
you can also change these settings with
nbsphinx_execute_arguments
in your conf.py file:
python
nbsphinx_execute_arguments = [
    "--InlineBackend.figure_formats={'svg', 'pdf'}",
    "--InlineBackend.rc=figure.dpi=96",
]
In the following example, nbsphinx should use an SVG image in the HTML output
and a PDF image for LaTeX/PDF output.
End of explanation
%config InlineBackend.figure_formats = ['png']
fig
Explanation: Alternatively, the figure format(s) can also be chosen directly in the notebook
(which overrides the setting in nbsphinx_execute_arguments and in the IPython configuration):
End of explanation
%config InlineBackend.figure_formats = ['png2x']
fig
Explanation: If you want to use PNG images, but with HiDPI resolution,
use the special 'png2x' (a.k.a. 'retina') format
(which also looks nice in the LaTeX output):
End of explanation
import numpy as np
import pandas as pd
df = pd.DataFrame(np.random.randint(0, 100, size=[5, 4]),
                  columns=['a', 'b', 'c', 'd'])
df
Explanation: Pandas Dataframes
Pandas dataframes
should be displayed as nicely formatted HTML tables (if you are using HTML output).
End of explanation
pd.set_option('display.latex.repr', True)
Explanation: For LaTeX output, however, the plain text output is used by default.
To get nice LaTeX tables, a few settings have to be changed:
End of explanation
pd.set_option('display.latex.longtable', True)
Explanation: This is not enabled by default because of
Pandas issue #12182.
The generated LaTeX tables utilize the booktabs package, so you have to make sure that package is loaded in the preamble with:
\usepackage{booktabs}
In order to allow page breaks within tables, you should use:
End of explanation
pd.set_option('display.latex.escape', False)
Explanation: The longtable package is already used by Sphinx,
so you don't have to manually load it in the preamble.
Finally, if you want to use LaTeX math expressions in your dataframe, you'll have to disable escaping:
End of explanation
df = pd.DataFrame(np.random.randint(0, 100, size=[10, 4]),
                  columns=[r'$\alpha$', r'$\beta$', r'$\gamma$', r'$\delta$'])
df
Explanation: The above settings should have no influence on the HTML output, but the LaTeX output should now look nicer:
End of explanation
from IPython.display import Markdown
md = Markdown(
# Markdown
It *should* show up as **formatted** text
with things like [links] and images.
[links]: https://jupyter.org/
![Jupyter notebook icon](images/notebook_icon.png)
## Markdown Extensions
There might also be mathematical equations like
$a^2 + b^2 = c^2$
and even tables:
A     | B     | A and B
------|-------|--------
False | False | False
True  | False | False
False | True  | False
True  | True  | True
)
md
Explanation: Markdown Content
End of explanation
from IPython.display import YouTubeVideo
YouTubeVideo('9_OIs49m56E')
Explanation: YouTube Videos
End of explanation
import ipywidgets as w
slider = w.IntSlider()
slider.value = 42
slider
Explanation: Interactive Widgets (HTML only)
The basic widget infrastructure is provided by
the ipywidgets module.
More advanced widgets are available in separate packages,
see for example https://jupyter.org/widgets.
The JavaScript code which is needed to display Jupyter widgets
is loaded automatically (using RequireJS).
If you want to use non-default URLs or local files,
you can use the
nbsphinx_widgets_path and
nbsphinx_requirejs_path
settings.
End of explanation
slider
Explanation: A widget typically consists of a so-called "model" and a "view" into that model.
If you display a widget multiple times,
all instances act as a "view" into the same "model".
That means that their state is synchronized.
You can move either one of these sliders to try this out:
End of explanation
link = w.IntSlider(description='link')
w.link((slider, 'value'), (link, 'value'))
jslink = w.IntSlider(description='jslink')
w.jslink((slider, 'value'), (jslink, 'value'))
dlink = w.IntSlider(description='dlink')
w.dlink((slider, 'value'), (dlink, 'value'))
jsdlink = w.IntSlider(description='jsdlink')
w.jsdlink((slider, 'value'), (jsdlink, 'value'))
w.VBox([link, jslink, dlink, jsdlink])
tabs = w.Tab()
for idx, obj in enumerate([df, fig, eq, i, md, slider]):
    out = w.Output()
    with out:
        display(obj)
    tabs.children += out,
    tabs.set_title(idx, obj.__class__.__name__)
tabs
Explanation: You can also link different widgets.
Widgets can be linked via the kernel
(which of course only works while a kernel is running)
or directly in the client
(which even works in the rendered HTML pages).
Widgets can be linked uni- or bi-directionally.
Examples for all 4 combinations are shown here:
End of explanation
%%javascript
var text = document.createTextNode("Hello, I was generated with JavaScript!");
// Content appended to "element" will be visible in the output area:
element.appendChild(text);
Explanation: <div class="alert alert-info">
Other Languages
The examples shown here are using Python,
but the widget technology can also be used with
different Jupyter kernels
(i.e. with different programming languages).
</div>
Troubleshooting
To obtain more information if widgets are not displayed as expected, you will need to look at the error message in the web browser console.
To figure out how to open the web browser console, you may look at the web browser documentation:
Chrome: https://developer.chrome.com/docs/devtools/open/#console
Firefox: https://developer.mozilla.org/en-US/docs/Tools/Web_Console#opening-the-web-console
The error is most probably linked to the JavaScript files not being loaded or loaded in the wrong order within the HTML file. To analyze the error, you can inspect the HTML file within the web browser (e.g.: right-click on the page and select View Page Source) and look at the &lt;head&gt; section of the page. That section should contain
some JavaScript libraries. Those relevant for widgets are:
```html
<!-- require.js is a mandatory dependency for jupyter-widgets -->
<script crossorigin="anonymous" integrity="sha256-Ae2Vz/4ePdIu6ZyI/5ZGsYnb+m0JlOmKPjt6XZ9JJkA=" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js"></script>
<!-- jupyter-widgets JavaScript -->
<script type="text/javascript" src="https://unpkg.com/@jupyter-widgets/html-manager@^0.18.0/dist/embed-amd.js"></script>
<!-- JavaScript containing custom Jupyter widgets -->
<script src="../_static/embed-widgets.js"></script>
```
The two first elements are mandatory. The third one is required only if you designed your own widgets but did not publish them on npm.js.
If those libraries appear in a different order, the widgets won't be displayed. 
Here is a list of possible solutions:
If the widgets are not displayed, see #519.
If the widgets are displayed multiple times, see #378.
Arbitrary JavaScript Output (HTML only)
End of explanation
display({
    'text/x-python': 'print("Hello, world!")',
    'text/x-haskell': 'main = putStrLn "Hello, world!"',
}, raw=True)
Explanation: Unsupported Output Types
If a code cell produces data with an unsupported MIME type, the Jupyter Notebook doesn't generate any output.
nbsphinx, however, shows a warning message.
End of explanation
print('BEWARE: \x1b[1;33;41mugly colors\x1b[m!', file=sys.stderr)
print('AB\x1b[43mCD\x1b[35mEF\x1b[1mGH\x1b[4mIJ\x1b[7m'
      'KL\x1b[49mMN\x1b[39mOP\x1b[22mQR\x1b[24mST\x1b[27mUV')
Explanation: ANSI Colors
The standard output and standard error streams may contain ANSI escape sequences to change the text and background colors.
End of explanation
text = ' XYZ '
formatstring = '\x1b[{}m' + text + '\x1b[m'
print(' ' * 6 + ' ' * len(text) +
      ''.join('{:^{}}'.format(bg, len(text)) for bg in range(40, 48)))
for fg in range(30, 38):
    for bold in False, True:
        fg_code = ('1;' if bold else '') + str(fg)
        print(' {:>4} '.format(fg_code) + formatstring.format(fg_code) +
              ''.join(formatstring.format(fg_code + ';' + str(bg))
                      for bg in range(40, 48)))
Explanation: The following code showing the 8 basic ANSI colors is based on https://tldp.org/HOWTO/Bash-Prompt-HOWTO/x329.html.
Each of the 8 colors has an "intense" variation, which is used for bold text.
End of explanation
formatstring = '\x1b[38;5;{0};48;5;{0}mX\x1b[1mX\x1b[m'
print('  + ' + ''.join('{:2}'.format(i) for i in range(36)))
print('  0 ' + ''.join(formatstring.format(i) for i in range(16)))
for i in range(7):
    i = i * 36 + 16
    print('{:3} '.format(i) + ''.join(formatstring.format(i + j)
                                      for j in range(36) if i + j < 256))
Explanation: ANSI also supports a set of 256 indexed colors.
The following code showing all of them is based on http://bitmote.com/index.php?post/2012/11/19/Using-ANSI-Color-Codes-to-Colorize-Your-Bash-Prompt-on-Linux.
End of explanation
start = 255, 0, 0
end = 0, 0, 255
length = 79
out = []
for i in range(length):
    rgb = [start[c] + int(i * (end[c] - start[c]) / length) for c in range(3)]
    out.append('\x1b['
               '38;2;{rgb[2]};{rgb[1]};{rgb[0]};'
               '48;2;{rgb[0]};{rgb[1]};{rgb[2]}mX\x1b[m'.format(rgb=rgb))
print(''.join(out))
Explanation: You can even use 24-bit RGB colors:
End of explanation
<END_TASK>