$r = String.raw
MarkdownIt = require('markdown-it/dist/markdown-it.js')
MarkdownItMathJax = require('markdown-it-mathjax').catch(() => window.markdownitMathjax)
mdit = MarkdownIt('commonmark', {
highlight: (str, lang) => {
if (lang && hljs.getLanguage(lang)) {
return hljs.highlight(lang, str, true).value
}
}
})
.use(MarkdownItMathJax())
.use(KatexRenderer())
KatexRenderer = function() {
function inlineRenderer(tokens, idx) {
return '<span class="katex">' + tex`${tokens[idx].content}`.innerHTML + '</span>'
}
function blockRenderer(tokens, idx) {
return '<span class="katex-display">' + tex.block`${tokens[idx].content}`.innerHTML + '</span>'
}
return function(md) {
md.renderer.rules.inline_math = inlineRenderer
md.renderer.rules.display_math = blockRenderer
}
}
mditRendererFactory = mditInstance => template(
text => {
const root = DOM.element('div')
root.innerHTML = mditInstance.render(text.replace(/\\([`$])/g, '$1'))
return root
},
() => DOM.element('div'), true)
hljs = require('@observablehq/highlight.js@2.0.0/highlight.min.js')
hljs.listLanguages()
md = mditRendererFactory(mdit)
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
