fxreader.online/freelance-project-34-marketing-blog
2
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity
d4ed93961b
freelance-project-34-market.../deps/ipython-fork/tools/tests/Markdown Pandoc Limitations.ipynb
Siarhei Siniak 1530fcf108 [~] Fork ipython 
1. 7f51a0332edd0c675c2d314ca3e62df7ef041281 deps/ipython (8.4.0-33-g7f51a0332)
2022-08-27 13:02:12 +03:00

2692 lines
83 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{
"cells": [
{
"cell_type": "markdown",
"metadata": {},
"source": [
"**WARNING: This document will not render correctly using nbviewer or nbconvert. To render this notebook correctly, open in `IPython Notebook` and run `Cell->Run All` from the menu bar.**"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"# Introduction"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"The IPython Notebook allows Markdown, HTML, and inline LaTeX in *Mardown Cells*. The inline LaTeX is parsed with [MathJax](http://www.mathjax.org/) and Markdown is parsed with [marked](https://github.com/chjj/marked). Any inline HTML is left to the web browser to parse. NBConvert is a utility that allows users to easily convert their notebooks to various formats. Pandoc is used to parse markdown text in NBConvert. Since what the notebook web interface supports is a mix of Markdown, HTML, and LaTeX, Pandoc has trouble converting notebook markdown. This results in incomplete representations of the notebook in nbviewer or a compiled Latex PDF.\n",
"\n",
"This isn't a Pandoc flaw; Pandoc isn't designed to parse and convert a mixed format document. Unfortunately, this means that Pandoc can only support a subset of the markup supported in the notebook web interface. This notebook compares output of Pandoc to the notebook web interface.\n",
"\n",
"**Changes:**\n",
"\n",
"05102013\n",
"\n",
" * heading anchors\n",
" * note on remote images\n",
"\n",
"06102013\n",
"\n",
" * remove strip_math_space filter\n",
" * add lxml test\n",
" \n",
"<style>\n",
" .rendered_html xmp { \n",
" white-space: pre-wrap;\n",
" }\n",
"</style>"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Utilities"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Define functions to render Markdown using the notebook and Pandoc."
]
},
{
"cell_type": "code",
"execution_count": 1,
"metadata": {
"collapsed": false
},
"outputs": [],
"source": [
"from IPython.nbconvert.utils.pandoc import pandoc\n",
"from IPython.display import HTML, Javascript, display\n",
"\n",
"from IPython.nbconvert.filters import citation2latex, strip_files_prefix, \\\n",
" markdown2html, markdown2latex\n",
"\n",
"def pandoc_render(markdown):\n",
" \"\"\"Render Pandoc Markdown->LaTeX content.\"\"\"\n",
" \n",
" ## Convert the markdown directly to latex. This is what nbconvert does.\n",
" #latex = pandoc(markdown, \"markdown\", \"latex\")\n",
" #html = pandoc(markdown, \"markdown\", \"html\", [\"--mathjax\"])\n",
" \n",
" # nbconvert template conversions\n",
" html = strip_files_prefix(markdown2html(markdown))\n",
" latex = markdown2latex(citation2latex(markdown))\n",
" display(HTML(data=\"<div style='display: inline-block; width: 30%; vertical-align: top;'>\" \\\n",
" \"<div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div>\" \\\n",
" \"<pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\" + latex + \"</xmp></pre>\"\\\n",
" \"</div>\" \\\n",
" \"<div style='display: inline-block; width: 2%;'></div>\" \\\n",
" \"<div style='display: inline-block; width: 30%; vertical-align: top;'>\" \\\n",
" \"<div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div>\" \\\n",
" \"<div style='display: inline-block; width: 100%;'>\" + html + \"</div>\" \\\n",
" \"</div>\"))\n",
" javascript = \"\"\"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n",
"\"\"\"\n",
" display(Javascript(data=javascript))\n",
"\n",
"def notebook_render(markdown):\n",
" javascript = \"\"\"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\"\"\" + markdown.replace(\"\\\\\", \"\\\\\\\\\").replace(\"'\", \"\\'\").replace(\"\\n\", \"\\\\n\") + \"\"\"');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n",
"\"\"\"\n",
" display(Javascript(data=javascript))\n",
"\n",
" \n",
"def pandoc_html_render(markdown):\n",
" \"\"\"Render Pandoc Markdown->LaTeX content.\"\"\"\n",
" \n",
" # Convert the markdown directly to latex. This is what nbconvert does.\n",
" latex = pandoc(markdown, \"markdown\", \"latex\")\n",
" \n",
" # Convert the pandoc generated latex to HTML so it can be rendered in \n",
" # the web browser.\n",
" html = pandoc(latex, \"latex\", \"html\", [\"--mathjax\"])\n",
" display(HTML(data=\"<div style='background: #AAFFAA; width: 40%;'>HTML Pandoc Output</div>\" \\\n",
" \"<div style='display: inline-block; width: 40%;'>\" + html + \"</div>\"))\n",
" return html\n",
" \n",
"def compare_render(markdown):\n",
" notebook_render(markdown)\n",
" pandoc_render(markdown)"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"# Outputs"
]
},
{
"cell_type": "code",
"execution_count": 1,
"metadata": {
"collapsed": false
},
"outputs": [
{
"name": "stdout",
"output_type": "stream",
"text": [
"LXML found!\n"
]
}
],
"source": [
"try:\n",
" import lxml\n",
" print 'LXML found!'\n",
"except:\n",
" print 'Warning! No LXML found - the old citation2latex filter will not work'"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## General markdown"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Heading level 6 is not supported by Pandoc."
]
},
{
"cell_type": "code",
"execution_count": 2,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n\\n# Heading 1 \\n## Heading 2 \\n### Heading 3 \\n#### Heading 4 \\n##### Heading 5 \\n###### Heading 6');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac2d0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\section{Heading 1}\n",
"\n",
"\\subsection{Heading 2}\n",
"\n",
"\\subsubsection{Heading 3}\n",
"\n",
"\\paragraph{Heading 4}\n",
"\n",
"\\subparagraph{Heading 5}\n",
"\n",
"Heading 6</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><h1 id=\"heading-1\">Heading 1</h1>\n",
"<h2 id=\"heading-2\">Heading 2</h2>\n",
"<h3 id=\"heading-3\">Heading 3</h3>\n",
"<h4 id=\"heading-4\">Heading 4</h4>\n",
"<h5 id=\"heading-5\">Heading 5</h5>\n",
"<h6 id=\"heading-6\">Heading 6</h6></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21b9fd0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21b9fd0>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"\n",
"# Heading 1 \n",
"## Heading 2 \n",
"### Heading 3 \n",
"#### Heading 4 \n",
"##### Heading 5 \n",
"###### Heading 6\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Headers aren't recognized by (Pandoc on Windows?) if there isn't a blank line above the headers."
]
},
{
"cell_type": "code",
"execution_count": 3,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n# Heading 1 \\n## Heading 2 \\n### Heading 3 \\n#### Heading 4 \\n##### Heading 5 \\n###### Heading 6 ');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac550>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\section{Heading 1}\n",
"\n",
"\\subsection{Heading 2}\n",
"\n",
"\\subsubsection{Heading 3}\n",
"\n",
"\\paragraph{Heading 4}\n",
"\n",
"\\subparagraph{Heading 5}\n",
"\n",
"Heading 6</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><h1 id=\"heading-1\">Heading 1</h1>\n",
"<h2 id=\"heading-2\">Heading 2</h2>\n",
"<h3 id=\"heading-3\">Heading 3</h3>\n",
"<h4 id=\"heading-4\">Heading 4</h4>\n",
"<h5 id=\"heading-5\">Heading 5</h5>\n",
"<h6 id=\"heading-6\">Heading 6</h6></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac550>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac550>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"name": "stdout",
"output_type": "stream",
"text": [
"\n",
"\n",
"\n",
"\n",
"\n",
"\n",
"\n",
"\n",
"\n",
"\n",
"\n"
]
}
],
"source": [
"compare_render(r\"\"\"\n",
"# Heading 1 \n",
"## Heading 2 \n",
"### Heading 3 \n",
"#### Heading 4 \n",
"##### Heading 5 \n",
"###### Heading 6 \"\"\")\n",
"\n",
"print(\"\\n\"*10)"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"If internal links are defined, these will not work in nbviewer and latex as the local link is not existing."
]
},
{
"cell_type": "code",
"execution_count": 4,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n[Link2Heading](http://127.0.0.1:8888/0a2d8086-ee24-4e5b-a32b-f66b525836cb#General-markdown)\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac210>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\href{http://127.0.0.1:8888/0a2d8086-ee24-4e5b-a32b-f66b525836cb\\#General-markdown}{Link2Heading}</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p><a href=\"http://127.0.0.1:8888/0a2d8086-ee24-4e5b-a32b-f66b525836cb#General-markdown\">Link2Heading</a></p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac210>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac210>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"[Link2Heading](http://127.0.0.1:8888/0a2d8086-ee24-4e5b-a32b-f66b525836cb#General-markdown)\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Basic Markdown bold and italic works."
]
},
{
"cell_type": "code",
"execution_count": 5,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\nThis is Markdown **bold** and *italic* text.\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>This is Markdown \\textbf{bold} and \\emph{italic} text.</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p>This is Markdown <strong>bold</strong> and <em>italic</em> text.</p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"This is Markdown **bold** and *italic* text.\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Nested lists work as well"
]
},
{
"cell_type": "code",
"execution_count": 6,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n- li 1\\n- li 2\\n 1. li 3\\n 1. li 4\\n- li 5\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac150>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\begin{itemize}\n",
"\\itemsep1pt\\parskip0pt\\parsep0pt\n",
"\\item\n",
" li 1\n",
"\\item\n",
" li 2\n",
"\n",
" \\begin{enumerate}\n",
" \\def\\labelenumi{\\arabic{enumi}.}\n",
" \\itemsep1pt\\parskip0pt\\parsep0pt\n",
" \\item\n",
" li 3\n",
" \\item\n",
" li 4\n",
" \\end{enumerate}\n",
"\\item\n",
" li 5\n",
"\\end{itemize}</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><ul>\n",
"<li>li 1</li>\n",
"<li>li 2\n",
"<ol style=\"list-style-type: decimal\">\n",
"<li>li 3</li>\n",
"<li>li 4</li>\n",
"</ol></li>\n",
"<li>li 5</li>\n",
"</ul></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac150>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac150>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"- li 1\n",
"- li 2\n",
" 1. li 3\n",
" 1. li 4\n",
"- li 5\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Unicode support"
]
},
{
"cell_type": "code",
"execution_count": 7,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\nüberschuß +***^°³³ α β θ\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x22b6950>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>überschuß +\\emph{*}\\^{}°³³ α β θ</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p>überschuß +<em>*</em>^°³³ α β θ</p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac3d0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac3d0>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(ur\"\"\"\n",
"überschuß +***^°³³ α β θ\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Pandoc may produce invalid latex, e.g \\sout is not allowed in headings"
]
},
{
"cell_type": "code",
"execution_count": 8,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n\\n# Heading 1 ~~strikeout~~\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\section{Heading 1 \\sout{strikeout}}</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><h1 id=\"heading-1-strikeout\">Heading 1 <del>strikeout</del></h1></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"\n",
"# Heading 1 ~~strikeout~~\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Horizontal lines work just fine"
]
},
{
"cell_type": "code",
"execution_count": 9,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\nabove\\n\\n--------\\n\\nbelow\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac150>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>above\n",
"\n",
"\\begin{center}\\rule{3in}{0.4pt}\\end{center}\n",
"\n",
"below</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p>above</p>\n",
"<hr />\n",
"<p>below</p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"above\n",
"\n",
"--------\n",
"\n",
"below\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Extended markdown of pandoc"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"(maybe we should deactivate this) "
]
},
{
"cell_type": "code",
"execution_count": 10,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\nThis is Markdown ~subscript~ and ^superscript^ text.\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac150>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>This is Markdown \\textsubscript{subscript} and\n",
"\\textsuperscript{superscript} text.</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p>This is Markdown <sub>subscript</sub> and <sup>superscript</sup> text.</p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac150>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac150>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"This is Markdown ~subscript~ and ^superscript^ text.\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"No space before underline behaves inconsistent (Pandoc extension: intraword_underscores - deactivate?)"
]
},
{
"cell_type": "code",
"execution_count": 11,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\nThis is Markdown not_italic_.\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac5d0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>This is Markdown not\\_italic\\_.</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p>This is Markdown not_italic_.</p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac5d0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac5d0>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"This is Markdown not_italic_.\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Pandoc allows to define tex macros which are respected for all output formats, the notebook not. "
]
},
{
"cell_type": "code",
"execution_count": 12,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n\\\\newcommand{\\\\tuple}[1]{\\\\langle #1 \\\\rangle}\\n\\n$\\\\tuple{a, b, c}$\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\newcommand{\\tuple}[1]{\\langle #1 \\rangle}\n",
"\n",
"$\\tuple{a, b, c}$</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p><span class=\"math\">\\(\\langle a, b, c \\rangle\\)</span></p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"\\newcommand{\\tuple}[1]{\\langle #1 \\rangle}\n",
"\n",
"$\\tuple{a, b, c}$\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"When placing the \\newcommand inside a math environment it works within the notebook and nbviewer, but produces invalid latex (the newcommand is only valid in the same math environment)."
]
},
{
"cell_type": "code",
"execution_count": 13,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n$\\\\newcommand{\\\\foo}[1]{...:: #1 ::...}$\\n$\\\\foo{bar}$\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>$\\newcommand{\\foo}[1]{...:: #1 ::...}$ $\\foo{bar}$</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p><span class=\"math\">\\(\\newcommand{\\foo}[1]{...:: #1 ::...}\\)</span> <span class=\"math\">\\(\\foo{bar}\\)</span></p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"$\\newcommand{\\foo}[1]{...:: #1 ::...}$\n",
"$\\foo{bar}$\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## HTML or LaTeX injections"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Raw HTML gets dropped entirely when converting to $\\LaTeX$."
]
},
{
"cell_type": "code",
"execution_count": 14,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\nThis is HTML <b>bold</b> and <i>italic</i> text.\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac5d0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>This is HTML bold and italic text.</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p>This is HTML <b>bold</b> and <i>italic</i> text.</p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac5d0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac5d0>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"This is HTML <b>bold</b> and <i>italic</i> text.\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Same for something like center"
]
},
{
"cell_type": "code",
"execution_count": 15,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n<center>Center aligned</center>\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac210>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>Center aligned</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><center>\n",
"Center aligned\n",
"</center></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac210>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac210>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"<center>Center aligned</center>\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Raw $\\LaTeX$ gets droppen entirely when converted to HTML. (I don't know why the HTML output is cropped here???)"
]
},
{
"cell_type": "code",
"execution_count": 16,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\nThis is \\\\LaTeX \\\\bf{bold} and \\\\emph{italic} text.\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>This is \\LaTeX \\bf{bold} and \\emph{italic} text.</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p>This is </p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"This is \\LaTeX \\bf{bold} and \\emph{italic} text.\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"A combination of raw $\\LaTeX$ and raw HTML"
]
},
{
"cell_type": "code",
"execution_count": 17,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n**foo** $\\\\left( \\\\sum_{k=1}^n a_k b_k \\\\right)^2 \\\\leq$ <b>b\\\\$ar</b> $$test$$ \\n\\\\cite{}\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\textbf{foo} $\\left( \\sum_{k=1}^n a_k b_k \\right)^2 \\leq$ b\\$ar \\[test\\]\n",
"\\cite{}</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p><strong>foo</strong> <span class=\"math\">\\(\\left( \\sum_{k=1}^n a_k b_k \\right)^2 \\leq\\)</span> <b>b$ar</b> <span class=\"math\">\\[test\\]</span> </p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac590>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"**foo** $\\left( \\sum_{k=1}^n a_k b_k \\right)^2 \\leq$ <b>b\\$ar</b> $$test$$ \n",
"\\cite{}\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Tables"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"HTML tables render in the notebook, but not in Pandoc."
]
},
{
"cell_type": "code",
"execution_count": 18,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n<table>\\n <tr>\\n <td>a</td>\\n <td>b</td>\\n </tr>\\n <tr>\\n <td>c</td>\\n <td>d</td>\\n </tr>\\n</table>\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac5d0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>a\n",
"\n",
"b\n",
"\n",
"c\n",
"\n",
"d</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><table>\n",
" <tr>\n",
" <td>\n",
"a\n",
"</td>\n",
" <td>\n",
"b\n",
"</td>\n",
" </tr>\n",
" <tr>\n",
" <td>\n",
"c\n",
"</td>\n",
" <td>\n",
"d\n",
"</td>\n",
" </tr>\n",
"</table></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac5d0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac5d0>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"<table>\n",
" <tr>\n",
" <td>a</td>\n",
" <td>b</td>\n",
" </tr>\n",
" <tr>\n",
" <td>c</td>\n",
" <td>d</td>\n",
" </tr>\n",
"</table>\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Instead, Pandoc supports simple ascii tables. Unfortunately marked.js doesn't support this, and therefore it is not supported in the notebook."
]
},
{
"cell_type": "code",
"execution_count": 19,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n+---+---+\\n| a | b |\\n+---+---+\\n| c | d |\\n+---+---+\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac210>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\begin{longtable}[c]{@{}ll@{}}\n",
"\\hline\\noalign{\\medskip}\n",
"\\begin{minipage}[t]{0.06\\columnwidth}\\raggedright\n",
"a\n",
"\\end{minipage} & \\begin{minipage}[t]{0.06\\columnwidth}\\raggedright\n",
"b\n",
"\\end{minipage}\n",
"\\\\\\noalign{\\medskip}\n",
"\\begin{minipage}[t]{0.06\\columnwidth}\\raggedright\n",
"c\n",
"\\end{minipage} & \\begin{minipage}[t]{0.06\\columnwidth}\\raggedright\n",
"d\n",
"\\end{minipage}\n",
"\\\\\\noalign{\\medskip}\n",
"\\hline\n",
"\\end{longtable}</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><table>\n",
"<col width=\"5%\" />\n",
"<col width=\"5%\" />\n",
"<tbody>\n",
"<tr class=\"odd\">\n",
"<td align=\"left\"><p>a</p></td>\n",
"<td align=\"left\"><p>b</p></td>\n",
"</tr>\n",
"<tr class=\"even\">\n",
"<td align=\"left\"><p>c</p></td>\n",
"<td align=\"left\"><p>d</p></td>\n",
"</tr>\n",
"</tbody>\n",
"</table></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac210>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac210>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"+---+---+\n",
"| a | b |\n",
"+---+---+\n",
"| c | d |\n",
"+---+---+\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"An alternative to basic ascii tables is pipe tables. Pipe tables can be recognized by Pandoc and are supported by marked, hence, this is the **best way to add tables**."
]
},
{
"cell_type": "code",
"execution_count": 20,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n|Left |Center |Right|\\n|:----|:-----:|----:|\\n|Text1|Text2 |Text3|\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac150>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\begin{longtable}[c]{@{}lcr@{}}\n",
"\\hline\\noalign{\\medskip}\n",
"Left & Center & Right\n",
"\\\\\\noalign{\\medskip}\n",
"\\hline\\noalign{\\medskip}\n",
"Text1 & Text2 & Text3\n",
"\\\\\\noalign{\\medskip}\n",
"\\hline\n",
"\\end{longtable}</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><table>\n",
"<thead>\n",
"<tr class=\"header\">\n",
"<th align=\"left\">Left</th>\n",
"<th align=\"center\">Center</th>\n",
"<th align=\"right\">Right</th>\n",
"</tr>\n",
"</thead>\n",
"<tbody>\n",
"<tr class=\"odd\">\n",
"<td align=\"left\">Text1</td>\n",
"<td align=\"center\">Text2</td>\n",
"<td align=\"right\">Text3</td>\n",
"</tr>\n",
"</tbody>\n",
"</table></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac150>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac150>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"|Left |Center |Right|\n",
"|:----|:-----:|----:|\n",
"|Text1|Text2 |Text3|\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Pandoc recognizes cell alignment in simple tables. Since marked.js doesn't recognize ascii tables, it can't render this table."
]
},
{
"cell_type": "code",
"execution_count": 21,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\nRight Aligned Center Aligned Left Aligned\\n------------- -------------- ------------\\n Why does this\\n actually work? Who\\n knows ...\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\begin{longtable}[c]{@{}lll@{}}\n",
"\\hline\\noalign{\\medskip}\n",
"Right Aligned & Center Aligned & Left Aligned\n",
"\\\\\\noalign{\\medskip}\n",
"\\hline\\noalign{\\medskip}\n",
"Why & does & this\n",
"\\\\\\noalign{\\medskip}\n",
"actually & work? & Who\n",
"\\\\\\noalign{\\medskip}\n",
"knows & \\ldots{} &\n",
"\\\\\\noalign{\\medskip}\n",
"\\hline\n",
"\\end{longtable}</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><table>\n",
"<thead>\n",
"<tr class=\"header\">\n",
"<th align=\"left\">Right Aligned</th>\n",
"<th align=\"left\">Center Aligned</th>\n",
"<th align=\"left\">Left Aligned</th>\n",
"</tr>\n",
"</thead>\n",
"<tbody>\n",
"<tr class=\"odd\">\n",
"<td align=\"left\">Why</td>\n",
"<td align=\"left\">does</td>\n",
"<td align=\"left\">this</td>\n",
"</tr>\n",
"<tr class=\"even\">\n",
"<td align=\"left\">actually</td>\n",
"<td align=\"left\">work?</td>\n",
"<td align=\"left\">Who</td>\n",
"</tr>\n",
"<tr class=\"odd\">\n",
"<td align=\"left\">knows</td>\n",
"<td align=\"left\">...</td>\n",
"<td align=\"left\"></td>\n",
"</tr>\n",
"</tbody>\n",
"</table></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"name": "stdout",
"output_type": "stream",
"text": [
"\n",
"\n",
"\n",
"\n",
"\n",
"\n"
]
}
],
"source": [
"compare_render(r\"\"\"\n",
"Right Aligned Center Aligned Left Aligned\n",
"------------- -------------- ------------\n",
" Why does this\n",
" actually work? Who\n",
" knows ...\n",
"\"\"\")\n",
"\n",
"print(\"\\n\"*5)"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Images"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Markdown images work on both. However, remote images are not allowed in $\\LaTeX$. Maybe add a preprocessor to download these.\n",
"The alternate text is displayed in nbviewer next to the image."
]
},
{
"cell_type": "code",
"execution_count": 22,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n![Alternate Text](https://ipython.org/_static/IPy_header.png)\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x22b6690>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\begin{figure}[htbp]\n",
"\\centering\n",
"\\includegraphics{https://ipython.org/_static/IPy_header.png}\n",
"\\caption{Alternate Text}\n",
"\\end{figure}</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><div class=\"figure\">\n",
"<img src=\"https://ipython.org/_static/IPy_header.png\" alt=\"Alternate Text\" /><p class=\"caption\">Alternate Text</p>\n",
"</div></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"![Alternate Text](https://ipython.org/_static/IPy_header.png)\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"HTML Images only work in the notebook."
]
},
{
"cell_type": "code",
"execution_count": 23,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n<img src=\"https://ipython.org/_static/IPy_header.png\">\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x22b65d0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp></xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p><img src=\"https://ipython.org/_static/IPy_header.png\"></p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"<img src=\"https://ipython.org/_static/IPy_header.png\">\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Math"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Simple inline and displaystyle maths work fine"
]
},
{
"cell_type": "code",
"execution_count": 24,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\nMy equation:\\n$$ 5/x=2y $$\\n\\nIt is inline $ 5/x=2y $ here.\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x22b6950>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>My equation: \\[ 5/x=2y \\]\n",
"\n",
"It is inline \\$ 5/x=2y \\$ here.</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p>My equation: <span class=\"math\">\\[ 5/x=2y \\]</span></p>\n",
"<p>It is inline $ 5/x=2y $ here.</p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"My equation:\n",
"$$ 5/x=2y $$\n",
"\n",
"It is inline $ 5/x=2y $ here.\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"If the first \\$ is on a new line, the equation is not captured by md2tex, if both \\$s are on a new line md2html fails (Note the raw latex is dropped) but the notebook renders it correctly."
]
},
{
"cell_type": "code",
"execution_count": 25,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n$5 \\\\cdot x=2$\\n\\n$\\n5 \\\\cdot x=2$\\n\\n$\\n5 \\\\cdot x=2\\n$\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x22b66d0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>$5 \\cdot x=2$\n",
"\n",
"\\$ 5 \\cdot x=2\\$\n",
"\n",
"\\$ 5 \\cdot x=2 \\$</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p><span class=\"math\">\\(5 \\cdot x=2\\)</span></p>\n",
"<p>$ 5 x=2$</p>\n",
"<p>$ 5 x=2 $</p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"$5 \\cdot x=2$\n",
"\n",
"$\n",
"5 \\cdot x=2$\n",
"\n",
"$\n",
"5 \\cdot x=2\n",
"$\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"MathJax permits some $\\LaTeX$ math constructs without \\$s, of course these raw $\\LaTeX$ is stripped when converting to html.\n",
"Moreove, the & are escaped by the lxml parsing [#4251](https://github.com/ipython/ipython/issues/4251)."
]
},
{
"cell_type": "code",
"execution_count": 26,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n\\\\begin{align}\\na & b\\\\\\\\\\nd & c\\n\\\\end{align}\\n\\n\\\\begin{eqnarray}\\na & b \\\\\\\\\\nc & d\\n\\\\end{eqnarray}\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x22b6690>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>\\begin{align}\n",
"a &amp; b\\\\\n",
"d &amp; c\n",
"\\end{align}\n",
"\n",
"\\begin{eqnarray}\n",
"a &amp; b \\\\\n",
"c &amp; d\n",
"\\end{eqnarray}</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"\\begin{align}\n",
"a & b\\\\\n",
"d & c\n",
"\\end{align}\n",
"\n",
"\\begin{eqnarray}\n",
"a & b \\\\\n",
"c & d\n",
"\\end{eqnarray}\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"There is another lxml issue, [#4283](https://github.com/ipython/ipython/issues/4283)"
]
},
{
"cell_type": "code",
"execution_count": 27,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\n1<2 is true, but 3>4 is false.\\n\\n$1<2$ is true, but $3>4$ is false.\\n\\n1<2 it is even worse if it is alone in a line.\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x22b6950>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>14 is false.\n",
"\n",
"$14$ is false.\n",
"\n",
"1</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p>1&lt;2 is true, but 3&gt;4 is false.</p>\n",
"<p><span class=\"math\">\\(1&lt;2\\)</span> is true, but <span class=\"math\">\\(3&gt;4\\)</span> is false.</p>\n",
"<p>1&lt;2 it is even worse if it is alone in a line.</p></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"1<2 is true, but 3>4 is false.\n",
"\n",
"$1<2$ is true, but $3>4$ is false.\n",
"\n",
"1<2 it is even worse if it is alone in a line.\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Listings, and Code blocks"
]
},
{
"cell_type": "code",
"execution_count": 28,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\nsome source code\\n\\n```\\na = \"test\"\\nprint(a)\\n```\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x22b68d0>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>some source code\n",
"\n",
"\\begin{verbatim}\n",
"a = \"test\"\n",
"print(a)\n",
"\\end{verbatim}</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p>some source code</p>\n",
"<pre><code>a = &quot;test&quot;\n",
"print(a)</code></pre></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"some source code\n",
"\n",
"```\n",
"a = \"test\"\n",
"print(a)\n",
"```\n",
"\"\"\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Language specific syntax highlighting by Pandoc requires additional dependencies to render correctly."
]
},
{
"cell_type": "code",
"execution_count": 29,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"application/javascript": [
"\n",
"var mdcell = new IPython.MarkdownCell();\n",
"mdcell.create_element();\n",
"mdcell.set_text('\\nsome source code\\n\\n```python\\na = \"test\"\\nprint(a)\\n```\\n');\n",
"mdcell.render();\n",
"$(element).append(mdcell.element)\n",
".removeClass()\n",
".css('left', '66%')\n",
".css('position', 'absolute')\n",
".css('width', '30%')\n",
"mdcell.element.prepend(\n",
" $('<div />')\n",
" .removeClass()\n",
" .css('background', '#AAAAFF')\n",
" .css('width', '100 %')\n",
" .html('Notebook Output')\n",
"\n",
");\n",
"container.show()\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x22b6850>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"text/html": [
"<div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #AAFFAA; width: 100%;'>NBConvert Latex Output</div><pre class='prettyprint lang-tex' style='background: #EEFFEE; border: 1px solid #DDEEDD;'><xmp>some source code\n",
"\n",
"\\begin{Shaded}\n",
"\\begin{Highlighting}[]\n",
"\\NormalTok{a = }\\StringTok{\"test\"}\n",
"\\KeywordTok{print}\\NormalTok{(a)}\n",
"\\end{Highlighting}\n",
"\\end{Shaded}</xmp></pre></div><div style='display: inline-block; width: 2%;'></div><div style='display: inline-block; width: 30%; vertical-align: top;'><div style='background: #FFAAAA; width: 100%;'>NBViewer Output</div><div style='display: inline-block; width: 100%;'><p>some source code</p>\n",
"<pre class=\"sourceCode python\"><code class=\"sourceCode python\">a = <span class=\"st\">&quot;test&quot;</span>\n",
"<span class=\"kw\">print</span>(a)</code></pre></div></div>"
],
"text/plain": [
"<IPython.core.display.HTML at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"\n",
" $.getScript(\"https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js\");\n"
],
"text/plain": [
"<IPython.core.display.Javascript at 0x21ac450>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"compare_render(r\"\"\"\n",
"some source code\n",
"\n",
"```python\n",
"a = \"test\"\n",
"print(a)\n",
"```\n",
"\"\"\")"
]
}
],
"metadata": {
"kernelspec": {
"display_name": "Python 3",
"language": "python",
"name": "python3"
},
"language_info": {
"codemirror_mode": {
"name": "ipython",
"version": 3
},
"file_extension": ".py",
"mimetype": "text/x-python",
"name": "python",
"nbconvert_exporter": "python",
"pygments_lexer": "ipython3",
"version": "3.4.2"
}
},
"nbformat": 4,
"nbformat_minor": 0
}
Reference in New Issue View Git Blame Copy Permalink