Software engineer at Hugging Face. Prototyping here with JS, d3, three.js.
Published
Edited
Feb 28, 2020
4 stars
html`<img src="${src}" style="max-width: 300px" />`
afterOnload = src =>
new Promise((resolve, reject) => {
const img = new Image();
img.onload = () => resolve(img);
img.onerror = reject;
img.crossOrigin = "anonymous";
img.src = src;
})
afterOnload(src).then(img => img.complete)
afterOnload(src).then(crop)
afterOnload(src).then(img => crop(img).toDataURL())
html`<img src="${await afterOnload(src).then(img =>
crop(img).toDataURL()
)}" style="max-width: 300px" />`
afterDecode = src => {
const img = new Image();
img.crossOrigin = "anonymous";
img.src = src;
return img.decode().then(() => img);
}
afterDecode(src).then(img => img.complete)
afterDecode(src).then(crop)
afterDecode(src).then(img => crop(img).toDataURL())
html`<img src="${await afterDecode(src).then(img =>
crop(img).toDataURL()
)}" style="max-width: 300px" />`
afterDecodeWithoutCORS = src => {
const img = new Image();
img.src = src;
return img.decode().then(() => img);
}
afterDecodeWithoutCORS(src).then(img => crop(img).toDataURL())
html`<img src="${await afterDecodeWithoutCORS(src).then(img =>
crop(img).toDataURL()
)}" style="max-width: 300px" />`
afterDecodeWithoutCORS(src).then(img => img.complete)
afterDecodeWithoutCORS(src).then(crop)
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.
