Published
Edited
Aug 23, 2022
Importers
Insert cell
Insert cell
Insert cell

{
function makeelt(str) {
return html`<span>${str}</span>`
}

return texmd`$\beta$ This is *more* useful: ${makeelt("this *isn't* markdown")} and it ${makeelt("*isn't* $te_x$")}, ${"yay"}!`
}


Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
stexmd=(str)=>{
// First perform tex replacement on all the strings in the template
// Each piece of tex is replaced with a placeholder for now, to keep it away from the markdown parser
var display_maths = [];
var inline_maths = [];
let strs=[str];
// Note use of raw strings here; important to keep backslashes intact so tex can see them
let strings =strs.map(function(string) {
// Then extract all the TeX code and replace it with placeholders (so it won't be run through md)
string = string.replace(/\$\$([^\$]*)\$\$/g, (s, m) => {
var i = display_maths.push(m) - 1;
return `\n\n<div class="dmath" n="${i}"></div>\n\n`;
});

string = string.replace(/\$([^\$]*)\$/g, (s, m) => {
var i = inline_maths.push(m) - 1;
return `<span class="imath" n="${i}"></span>`;
});

return string
})
// Now we can run this through markdown with proper ${} substitutions
var node = md(strings);
// And finally replace TeX placeholders with output of tex()
node.querySelectorAll('span.imath').forEach(span => {
var i = parseInt(span.attributes.n.value);
if (inline_maths[i] === undefined) throw 'What?';
span.appendChild(tex`${inline_maths[i]}`);
span.style['font-size'] = '.95em';
});
node.querySelectorAll('div.dmath').forEach(div => {
var i = parseInt(div.attributes.n.value);
div.appendChild(tex.block`${display_maths[i]}`);
div.style['font-size'] = '.95em';
});
return node
}
Insert cell
stexmd('$x^2$ is **good**!')
Insert cell

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.
Learn more