ArcGIS Notebooks are based on the open-source Jupyter notebook, which has been included in the ArcGIS Pro Python distribution since ArcGIS Pro 2.1.Since Pro 2.5, notebooks can run directly in ArcGIS Pro allowing a side-by-side view of your map and notebook and for direct interactions with the data on your map. Markdown Template with inserted variables. With the Jupyter extension Python Markdown it actually is possible to do exactly what you describe. Installation instructions can be found on the github page of nbextensions. Make sure you’ll enable the python markdown extension using a jupyter command or the extension configurator. When the notebook is refreshed in Jupyter, cell inputs are loaded from the script or Markdown document and kernel variables are preserved. Cell outputs are taken from the original Jupyter notebook if you use paired notebooks, which we recommend. Jupyter (formerly IPython Notebook) is an open-source project that lets you easily combine Markdown text and executable Python source code on one canvas called a notebook. Visual Studio Code supports working with Jupyter Notebooks natively, as well as through Python code files. We can also change the type of a cell to markdown with m and to Python code with y. Then we saw how to work with Python code in Jupyter notebooks. We saw that to have our code in a cell executed, we need to press shift + enter. If we do not do this, then our variables that we assigned in Python are not going to be recognized by Python later on.
- Jupyter Notebook Python Variable In Markdown
- Jupyter Notebook Markdown Latex
- Jupyter Notebook Markdown Font Size
- Markdown In Jupyter Notebook
A common use of directives and roles is to designate “special blocks” of your content.This allows you to include more complex information such as warnings and notes, citations, and figures.This section covers a few common ones.
MyST syntax extensions¶
MyST Markdown has a base syntax that it supports, and additional syntax can be enabled to add extra functionality.By default, Jupyter Book enables a few extra syntax pieces for MyST in order to more closely resemble the Markdown experience in Jupyter Notebooks and interfaces.These extensions are:
dollarmath
To support $$
and $
syntax for math blocks. See Math and equations.
linkify
To auto-detect HTML-like links in your markdown and convert them to hyperlinks.
substitution
To allow you to define markdown “variables” and substitute text in using them. See Substitutions and variables in markdown.
colon_fence
To allow you to use :::
fences for admonitions, in order to make them easier to render in interfaces that do not support MyST. See Markdown-friendly directives with :::.
To enable your own syntax extensions, use the following configuration pattern:
Note that this will override the default Jupyter Book extension list.You should include all of the extensions that you want to be enabled.
See also
For a list of syntax extensions in MyST, see the MyST documentation.
Notes, warnings, and other admonitions¶
Let’s say you wish to highlight a particular block of text that exists slightly apart from the narrative of your page.You can use the {note}
directive for this.
For example, the following text:
Results in the following output:
Note
Here is a note!
There are a number of similarly-styled blocks of text. For example, here is a {warning}
block:
Warning
Here’s a warning! It was created with:
For a complete list of options, see the sphinx-book-theme
documentation.
Jupyter Notebook Python Variable In Markdown
Blocks of text with custom titles¶
You can also choose the title of your message box by using the{admonition}
directive. For example, the following text:
Results in the following output:
Here’s your admonition
Here’s the admonition content
If you’d like to style these blocks, then use the :class:
option. Forexample:
This admonition was styled…
Using the following pattern:
Markdown-friendly directives with :::
¶
The admonition syntax above utilises the general directives syntax.However, if you’re using an interface that does not support MyST Markdown, it will render as a raw literal block.Many directives contain markdown inside, and if you’d like this markdown to render “normally”, you may also use :::
fences rather than ```
fences to define the directive. As a result, the contents of the directive will be rendered as markdown.
For example:
Note
This text is standardMarkdown
Similar to normal directives, these admonitions can also be nested:
Important
Note
You can use this syntax for any kind of directive, though it is generally recommended to use only with directives that contain pure markdown in their content.
Insert code cell outputs into admonitions¶
If you’d like to insert the outputs of running code inside admonitionblocks, we recommend using glue
functionality.For example, we’ll insert one of the outputs that was glued into the book from the code outputs page.
The code below:
generates:
Note
Here’s my figure:
See Insert code outputs into page content for more information on how to use glue
to insert your outputs directly into your content.
Tip
To hide code input and output that generated the variable you are inserting, use the remove_cell
tag.See Hide or remove content for more information and other tag options.
HTML admonitions¶
A drawback of admonition syntax is that it will not render in interfaces that do not support this syntax (e.g., GitHub). If you’d like to use admonitions that are defined purely with HTML, MyST can parse them via the html_admonitions
extension. To use it, first enable it with the following configuration:
Then, you may define admonitions in your book like so:
See HTML Admonitions for more information about HTML admonitions.
Panels¶
Panels provide an easy way for you to organize chunks of content into flexible containers on your page.They are useful for creating card-like layouts, flexible columns, and grids.Panels are based off of Bootstrap CSS, and utilize Bootstrap’s classes to control the look and feel of panels.
Here is an example that creates two panels:
---
separates each panel^^^
defines the panel header+++
defines the panel footer
Note Do more with membership.
Panel headers and footers are optional.If you don’t include ^^^
or +++
in your panel, they will not show up.
You can embed all kinds of content inside of panels. For example, the following panels:
were created with:
See also
See the Sphinx Panels card layout documentation for more information.
Controlling the look and feel of panels¶
You can control the look and feel of panels by passing attaching bootstrap classes to panel headers/body/footers.You do this by passing configuration options to your {panels}
directive.
For example:
See also
See the Panels card styling documentation for more information.
For example, you can control how many columns are in your panels by using Bootstrap column classes. These panels:
Body A
Body B
Body C
Were created by this code:
Dropdowns¶
Dropdowns allows you to hide content behind a title and a button.There are two kinds of dropdowns in Jupyter Book:
The {dropdown}
directive¶
Use the {dropdown}
directive to create a clickable dropdown with a title.
For example:
Here’s my dropdown
Dropdown admonitions¶
You can also hide the body of your admonition blocks so that users must click a button to reveal their content.This is helpful if you’d like to include some text that isn’t immediately visible to the user.
To turn an admonition into a dropdown, add the dropdown
class to them. For example:
You can use this in conjunction with {admonition}
directives to include yourown titles and stylings. For example:
Important
Admonition dropdowns require JavaScript to be enabled on the browser which they are viewed.By contrast, the dropdown directive below works purely via HTML+CSS.
Definition lists¶
Definition lists are enabled by defining the following setting in your _config.yml
:
Definition lists utilise the markdown-it-py deflist plugin, which itself is based on the Pandoc definition list specification.
Here’s an example:
Definition
Definition
From the Pandoc documentation:
Each term must fit on one line, which may optionally be followed by a blank line, and must be followed by one or more definitions.A definition begins with a colon or tilde, which may be indented one or two spaces.
A term may have multiple definitions, and each definition may consist of one or more block elements (paragraphs, code blocks, lists, etc.)
Here is a more complex example, demonstrating some of these features:
Definition with reference
A second paragraph
A second definition
Definition 2a
Definition 2b
A quote
A final definition, that can even include images:
This was created with the following Markdown:
Quotations and epigraphs¶
Quotations and epigraphs provide ways to highlight information given by others.
Quotations¶
Regular quotations are controlled with standard Markdown syntax, i.e., byinserting a caret (>
) symbol in front of one or more lines of text. For example:
Epigraphs¶
Epigraphs draw more attention to a quote and highlight its author. You shouldkeep these relatively short so that they don’t take up too much vertical space. Here’show an epigraph looks:
You can provide an attribution to an epigraph by adding --
to the final line, followed by the quote author. For example:
Glossaries¶
Glossaries allow you to define terms in a glossary so you can then link back to itthroughout your content. You can create a glossary with the followingsyntax:
which creates:
An indented explanation of term 1
An indented explanation of term2
To reference terms in your glossary, use the {term}
role. For example,{term}`Termone`
becomes Term one and {term}`Asecondterm`
becomes A second term.
Tabbed content¶
You can also use sphinx-panels
to produce tabbed content.This allows you to display a variety of tabbed content blocks that users can click on.
For example, here’s a group of tabs showing off code in a few different languages:
You can use this functionality with the {tabbed}
directive. You can provide a sequence of {tabbed}
directives, and each one will be used to generate a new tab (unless the :new-group:
option is added to a {tabbed}
directive.)
For example, the following code:
produces
My second tab with somecode
!
Insert code outputs in your tabs with the glue
functionality.
For example, the following tabs use this functionality to glue images and tables generated somewhere else in these docs:
Fig. 1 This is a caption, with an embedded {glue:text}
element: 3.00!¶
first | second | third | |
---|---|---|---|
0 | 2.864279 | 3.096170 | 3.040294 |
1 | 2.850520 | 3.582923 | 2.632284 |
2 | 3.182612 | 3.026727 | 3.013184 |
3 | 3.159771 | 2.793257 | 3.151598 |
4 | 3.087032 | 3.159038 | 3.132074 |
Fig. 2 A caption for a pandas table.¶
See the sphinx-panels
tabbed documentation for more information on how to use this.
Substitutions and variables in markdown¶
Substitutions allow you to define variables in the front-matter of your page, and then insert those variables into your content throughout.
To use a substitution, first add front-matter content to the top of a page like so:
You can use these substitutions inline or as blocks, and you can even nest substitutions in other substitutions (but circular references are prohibited):
Inline: I’m a substitution
Block level:
You can also insert substitutions inside of other markdown structures like tables:
col1 | col2 |
---|
See also
For more information about Substitutions, see Substitutions (with Jinja2).
Define substitutions for your whole book¶
You can also define book-level substitution variables with the following configuration:
These substitutions will be available throughout your book. For example, the global substitution key my-global-substitution
is defined in this book’s _config.yml
file, and it produces: My global value!.
Formatting substitutions¶
MyST substitutions use Jinja templates in order to substite in key / values. This means that you can apply any standard Jinja formatting to your substitutions. For example, you can replace text in your substitutions like so:
The original key1: I’m a substitution
I’m the best substitution
Using substitutions in links¶
If you’d like to use substitutions to insert and modify links in your book, here are two options to explore:
Define the entire markdown link as a variable. For example:
Here’s my link: my repo url
Use Jinja features to insert the variable.Because substitutions use Jinja templates, you also have access to Python formatting operations in your substitution.For example:
Here’s my link: my repo:
jupyter-book
Citations and cross-references¶
You can add citations and cross-references to your book. SeeCitations and bibliographies for more information on how to do this.
Figures¶
You can thoroughly customise the look of figures in your book. See Images and figures formore information.
Page layout and sidebar content¶
You can also use MyST to control various aspects of the page layout. For moreinformation on this, see Control the page layout.
Footnotes¶
You can include footnotes in your book using standard Markdown syntax.This will include a numbered reference to the footnote in-line, and append the footnoteto a list of footnotes at the bottom of the page.
To create a footnote, first insert a reference in-line with this syntax: [^mylabel]
.Then, define the text for that label like so:
You can define [^mylabel]
anywhere in the page, though its definition will alwaysbe placed at the bottom of your built page. For example, here’s a footnote 1and here’s another one 2. You can click either of them to see the footnotesat the bottom of this page.
Custom <div>
blocks¶
You can add custom div
blocks along with whatever classes you’d like usingthe {div}
directive. The {div}
directive will wrap everything inside in a single <div>
with the classes you provide. For example:
Will result in the following HTML when your book is built:
This can be useful if you’d like to style your book with custom CSS or JavaScript.
Here’s the text of my first note.
And the text of my second note.Note thatyou can include Markdown footnote definitions.
Learning Objectives
- Explain what the
Markdown
format is. - Describe the role of
Markdown
for documentation of earth data science workflows. - Use
Markdown
syntax inJupyter Notebook
to:- Create headers and lists
- Bold and italicize bold text
- Render images and create hyperlinks to web pages
What is Markdown?
Markdown
is a human readable syntax (also referred to as a markup language) for formatting text documents. Markdown
can be used to produce nicely formatted documents including PDFs and web pages.
When you format text using Markdown
in a document, it is similar to using the format tools (e.g. bold, heading 1, heading 2) in a word processing tool like Microsoft Word or Google Docs. However, instead of using buttons to apply formatting, you use syntax such as **this syntax bolds text in markdown**
or # Here is a heading
.
Markdown
syntax allows you to format text in many ways, such as making headings, bolding and italicizing words, creating bulleted lists, adding links, formatting mathematical symbols and making tables. These options allow you to format text in visually appealing and organized ways to present your ideas.
You can use Markdown to format text in many different tools including GitHub.com, R using RMarkdown, and Jupyter Notebook, which you will learn more about this page.
Data Tip: Learn more about how you can use Markdown to format text and document workflows in a variety of tools.
Markdown in Jupyter Notebook
Boston massacretext, context, and subtextmacs history. A great benefit of Jupyter Notebook
is that it allows you to combine both code (e.g. Python
) and Markdown
in one document, so that you can easily document your workflows.
A Jupyter Notebook
file uses cells to organize content, and it can contain both cells that render text written using the Markdown
syntax as well as cells that contain and run Python
code.
Thus, you can use a combination of Markdown
and Python
code cells to organize and document your Jupyter Notebook
for others to easily read and follow your workflow.
Data Tip: Learn more about Markdown for Jupyter Notebook.
If you render your Jupyter Notebook
file to HTML or PDF, this Markdown
will appear as formatted text in the output document.
Data Tip: In fact, this web page that you are reading right now is generated from a Markdown
document! On this page, you will learn the basic syntax of Markdown
.
Benefits of Markdown for Earth Data Science
Being able to include both Markdown
and code (e.g. Python
) cells in a Jupyter Notebook
file supports reproducible science by allowing you to:
- Document your workflow: You can add text to the document that describes the steps of your processing workflow (e.g. how data is being processed and what results are produced).
- Describe your data: You can describe the data that you are using (e.g. source, pre-processing, metadata).
- Interpret code outputs: You can add some text that interprets or discusses the outputs.
all in one document!
When used effectively, Markdown
documentation can help anyone who opens your Jupyter Notebook
to follow, understand and even reproduce your workflow.
Format Text in Jupyter Notebook with Markdown
Markdown Cells in Jupyter Notebook
In the previous chapter on Jupyter Notebook
, you learned how to add new Markdown
cells to your Jupyter Notebook
files using Menu tools and Keyboard Shortcuts to create new cells.
Function | Keyboard Shortcut | Menu Tools |
---|---|---|
Create new cell | Esc + a (above), Esc + b (below) | Insert→ Insert Cell Above OR Insert → Insert Cell Below |
Copy Cell | c | Copy Key |
Paste Cell | v | Paste Key |
You also learned how to change the default type of the cell by clicking in the cell and selecting a new cell type (e.g. Markdown
) in the cell type menu in the toolbar. Furthermore, you learned that in a Jupyter Notebook
file, you can double-click in any Markdown
cell to see the syntax, and then run the cell again to see the Markdown
formatting.
Note: if you type text in a Markdown
cell with no additional syntax, the text will appear as regular paragraph text. You can add additional syntax to that text to format it in different ways.
On this page, you will learn basic Markdown
syntax that you can use to format text in Jupyter Notebook
files.
Section Headers
You can create a heading using the pound (#
) sign. For the headers to render properly, there must be a space between the #
and the header text.
Heading one is denoted using one #
sign, heading two is denoted using two ##
signs, etc, as follows:
Here is a sample of the rendered Markdown
:
Heading Three
Heading Four
Jupyter Notebook Markdown Latex
Note: the titles on this page are actually formatted using Markdown
(e.g. the words Section Headers above are formatted as a heading two).
Lists
You can also use Markdown
to create lists using the following syntax:
It will render as follows:
- This is a bullet list
- This is a bullet list
- This is a bullet list
- And you can also create ordered lists
- by using numbers
- and listing new items in the lists
- on their own lines
Notice that you have space between the *
or 1.
and the text. The space triggers the action to create the list using Markdown
.
Bold and Italicize
You can also use **
to bold or *
to italicize words. To bold and italicize words, the symbols have to be touching the word and have to be repeated before and after the word using the following syntax:
It will render as follows:
These are italicized words, not a bullet listThese are bold words, not a bullet list
- This is a bullet item with bold words
- This is a bullet item with italicized words
Highlight Code
If you want to highlight a function or some code within a plain text paragraph, you can use one backtick on each side of the text like this:
which renders like this:
Here is some code!
The symbol used is the backtick, or grave; not an apostrophe (on most US keyboards, it is on the same key as the tilde (~)).
Horizontal Lines (Rules)
You can also create a horizontal line or rule to highlight a block of Markdown
syntax (similar to the highlighting a block of code using the backticks):
Jupyter Notebook Markdown Font Size
which renders like this:
Here is some important text!
Hyperlinks
You can also use HTML in Markdown
cells to create hyperlinks to websites using the following syntax:
Markdown In Jupyter Notebook
<a href='url' target='_blank'>hyperlinked words</a>
You can identify the words that will be hyperlinked (i.e. prompt a web page to open when clicked) by replacing hyperlinked words
in the example above.
For example, the following syntax:
Our program website can be found at <a href='http://earthdatascience.org' target='_blank'>this link</a>.
will render as follows with this link
as the hyperlinked words:
Our program website can be found at this link.
Render Images
You can also use Markdown
to link to images on the web using the following syntax:
![alt text here](url-to-image-here)
The alt text is the alternative text that appears if an image fails to load on webpage; it is also used by screen-reading tools to identify the image to users of the screen-reading tools.
For example, the following syntax:
![Markdown Logo is here.](https://www.fullstackpython.com/img/logos/markdown.png)
will render as follows with an alt text of Markdown Logo is here.
:
Local Images Using Relative Computer Paths
You can also add images to a Markdown
cell using relative paths to files in your directory structure using:
![alt text here](path-to-image-here)
For relative paths (images stored on your computer) to work in Jupyter Notebook
, you need to place the image in a location on your computer that is RELATIVE to your .ipynb
file. This is where good file management becomes extremely important.
For a simple example of using relative paths, imagine that you have a subdirectory named images
in your earth-analytics
directory (i.e. earth-analytics/images/
).
If your Jupyter Notebook
file (.ipynb
) is located in root of this directory (i.e. earth-analytics/notebook.ipynb
), and all images that you want to include in your report are located in the images
subdirectory (i.e. earth-analytics/images/
), then the path that you would use for each image is:
images/image-name.png
If all of your images are in the images
subdirectory, then you will be able to easily find them. This also follows good file management practices because all of the images that you use in your report are contained within your project directory.
Data tip: There are many free Markdown
editors out there! The atom.io editor is a powerful text editor package by GitHub, that also has a Markdown
renderer that allows you to preview the rendered Markdown
as you write.
Additional Resources
Practice Your Markdown Skills
Open or create a new
Jupyter Notebook
file.- Add a new
Markdown
cell and include:- A title for the notebook (e.g.
Intro to Earth Analytics - Chapter Four
) - A bullet list with:
- A bold word for
Author:
and then add text for your name. - A bold word for
Date:
and then add text for today’s date.
- A bold word for
- A title for the notebook (e.g.
- Add another
Markdown
cell and include:- A list of your top three favorite foods (e.g. blueberries, chocolate bars, avocados).
- Italicize the first item in your list.
- Add a hyperlink (i.e. webpages) for the second item in your list (include the name of the food in the title of the hyperlink).
- Add an image for the last item in your list (include the name in the alt text of the image).
- A list of your top three favorite foods (e.g. blueberries, chocolate bars, avocados).