plot = {
// set up a Textbox that take HTML input and emits React output
const box = new Textbox({
font: '14px/18px sans-serif',
width: width,
parser: Textbox.htmlparser,
createElement: React.createElement
});
// linebreak the text - this is done first to attain the height
const lines = box.linebreak(await FileAttachment("html.html").text());
// generate a SVG using React
const createElement = React.createElement;
const svg = createElement('svg', { width: width, height: lines.height + 20 },
createElement('g', null, lines.svg()));
// render into a node Observable can read
let parent = html`<div>`;
ReactDOM.render(svg, parent);
return parent;
}
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.
