// Demonstrate BqManager.prototype.rendering_cells promise
keepalive();
ocx.bq.rendering_cells?.then(error => {
if (!error) {
ocx.markdown('# Render complete!');
cell.scroll_into_view(true);
}
});
## Markdown
*... with math:*
$$
x = \frac{-b \pm \sqrt{b^2 - 4 a c}}{2 a}
$$
*... with code:*
```!$ javascript
let s = 0;
for (let i = 1; i < 10_000_000; i++) {
s += 1/(i*i);
}
yield sprintf('result = %7f\n', Math.sqrt(s*6));
```
ocx.update_style({
'max-width': '6em',
color: 'purple',
background: 'aliceblue',
border: '1px solid black',
padding: '0.5em',
overflow: 'hidden',
});
const ccx = ocx.create_child_ocx({
style: {
color: 'red',
background: 'yellow',
'border-radius': '0.5em',
},
});
await ocx.println('1. xyzzy');
await ccx.println('2. whir!');
await ocx.println('3. third');
await ccx.println('4. buzz!');
await ocx.println('5. fifth');
\mathnormal{N}(x ; \mu, \sigma) = \int_0^x \negthickspace { \frac{1}{\sigma \sqrt{2 \pi}} e^{- \frac{1}{2}( \frac{t - \mu}{\sigma} )^2} dt }
// from https://plotly.com/javascript/line-charts/
const trace1 = {
x: [ 1, 2, 3, 4, 5, 6, 7 ],
y: [ 10, 15, 13, 17, 11, 12, 20 ],
type: 'scatter',
};
const trace2 = {
x: [ 1, 2, 3, 4, 5, 6, 7 ],
y: [ 16, 5, 11, 9, 20, 1, 4 ],
type: 'scatter',
};
await plotly([ trace1, trace2 ]);
await graphviz({ nodes: "abc", edges: ["ab", "bc", "ca"] });
// Custom Renderer Example
const bullet = '\u00b7'; // middle dot
class ListItemRenderer extends TextBasedRenderer {
static type = 'list-item';
async _render(ocx, value, options) {
return ocx.render_text(`${bullet} ${value?.trim()}\n`);
}
}
TextBasedRenderer.add_renderer_factory(ListItemRenderer);
### Custom Renderer Example
```! list-item
abc
```
```! list-item
def
```
```! list-item
ghi
```
const worker = await create_worker({ keepalive: true });
const worker_code = 'for (let i = 0; i < 10; i++) { await new Promise(resolve => setTimeout(resolve, 100)); yield `Reply #${i}`; }';
for await (const reply of worker.stream_eval(worker_code)) {
println(reply);
}
println(await worker.eval('return (Math.sqrt(5) + 1) / 2'));
# $x\textrm{b}$
$$
a x^2 + b x + c = 0
$$
$$
x = \frac{-b \pm \sqrt{b^2 - 4 a c}}{2 a}
$$
```! javascript
await markdown(`## Seconds since 1 Jan 1970: ${Date.now()/1000}`);
function test(x) { return `--- ${x} ---`; }
await print__();
for (let i = 100; i < 200; i++) {
await printf(' %s', test(i));
await sleep(0.01);
}
```
bg(async () => {
for (let i = 100; i < 200; i++) {
await printf(' %d', i);
await sleep(0.01);
}
end_bg();
});
The quick brown fox jumped over the lazy dog's back.