Data visualization/Interactive media and full-stack data science web app developer.
viewof worker = {
var dom = html`<div>👔 Worker loading..`;
var sqljs_wasm = await FileAttachment("sql-wasm.wasm").url();
var sqljs_js_text = await FileAttachment("worker.sql-wasm.js").text();
//Observable Hack to load wasm file...
sqljs_js_text = sqljs_js_text.replace(
"'undefined' ? moduleConfig : {};",
`'undefined' ? moduleConfig : {locateFile: filename => "${sqljs_wasm}"};`
);
var blob = new Blob([sqljs_js_text], { type: 'application/javascript' });
var url_obj = URL.createObjectURL(blob);
var worker = new Worker(url_obj);
worker.onerror = () => {
dom.innerHTML = "⛑️ Failed";
dom.value = null;
dom.dispatchEvent(new CustomEvent("input"));
};
worker.onmessage = event => {
dom.innerHTML = "🕶️ DB Loaded to worker";
dom.value = worker;
dom.dispatchEvent(new CustomEvent("input"));
};
worker.postMessage({
action: "open",
buffer: db
});
return dom;
}
//A simple query to demonstrate that the worker can handle multiple queries simultaniously (on start, both queries are executed at once)...
q.query("select * from DimProduct")
// preventing intermediate queries from being generated while using the slider...
debounce_range = debounce(viewof range, 200)
//Query with a join.. it takes around 0.2 Seconds typically
sample = q.query(`SELECT
*
FROM
(SELECT
DISTINCT(EnglishProductName) AS product, Color,sum(SalesAmount) AS total
FROM
FactInternetSales
INNER JOIN
DimProduct ON FactInternetSales.ProductKey = DimProduct.ProductKey
GROUP BY
EnglishProductName)
WHERE
total BETWEEN ${debounce_range[0]} AND ${debounce_range[1]}
`)
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.
