I love to build dataviz for insight discovery. I also love to put technology to the service of humanity
Reusable and Reactive Visualization Widgets or ComponentsSearch Checkbox 🔎☑Faceted SearchChoropleth MapMulti Auto SelectScented CheckboxNavioVega SelectedPersist InputVega crossfilterSpaceTreeTree, ValueCollapsible TreeTree, Tidy fit to HeightZoomable Variable Size IcicleVisualize ERD SQLITE3 (WIP)Conditional ShowBrushable ScatterPlot (Reactive Widget)Force Directed Reactive WidgetImage LoaderThrottleBrushable HistogramInput NumberCached WidgetPersistent Table
On Click Button
function OnClickButton(label, opts) {
const btn = Inputs.button(label, opts);
if (opts.onClick) {
btn.addEventListener("click", opts.onClick);
}
if (opts.class) {
[...btn.getElementsByTagName("button")].forEach((b) =>
b.setAttribute("class", opts.class)
);
}
if (opts.style) {
btn.style = opts.style;
}
return btn;
}
function OnClickLink(label, opts) {
const btn = htl.html`<a href="">${label}</a>`;
if (opts.onClick) {
btn.addEventListener("click", (evt) => {
evt.preventDefault();
opts.onClick(evt);
});
}
if (opts.class) {
btn.setAttribute("class", opts.class);
}
if (opts.style) {
btn.style = opts.style;
}
return btn;
}
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.
