html`<div style="display: grid; grid-template-columns: 1fr 1fr 1fr 1fr">${faucets
.reverse()
.map(
(img) =>
`<div style="font-size: 0.7em; font-family: sans-serif; word-wrap: break-word;"><img style="width: 95%" src="https://www.plumbershaven.com/${img[0]}"><br>${img[0]}<br>${img[1]}</div>`
)
.join("")}</div>`
viewof pasted = Inputs.textarea()
html`<div style="display: grid; grid-template-columns: 1fr 1fr 1fr 1fr">${pastedFaucets
.reverse()
.map(
(img) =>
`<div style="font-size: 0.7em; font-family: sans-serif;"><img style="width: 95%" src="https://www.plumbershaven.com/${img[0]}"><br>${img[0]}<br>${img[1]}</div>`
)
.join("")}</div>`
pastedFaucets = pasted
? (
await fetch(
`https://faucet-finder.fly.dev/faucets.json?sql=select+value+from+json_each(faiss_search_with_scores(%27faucets%27%2C+%27embeddings%27%2C+faiss_encode(%3Adata)%2C+4))&data=${pasted}&_shape=arrayfirst&_json=value`
)
).json()
: []
faucets = (
await fetch(
`https://faucet-finder.fly.dev/faucets.json?sql=select+value+from+json_each(faiss_search_with_scores(%27faucets%27%2C+%27embeddings%27%2C+faiss_encode(%3Adata)%2C+4))&data=${JSON.stringify(
Array.from(textEmbeddings.text_embeds.data)
)}&_shape=arrayfirst&_json=value`
)
).json()
html`<textarea style="width: 100%; height: 10em">${JSON.stringify(
Array.from(textEmbeddings.text_embeds.data)
)}</textarea>`
transformers = import("https://cdn.jsdelivr.net/npm/@xenova/transformers")
tokenizer = await transformers.AutoTokenizer.from_pretrained(
"Xenova/clip-vit-base-patch32"
)
text_model = await transformers.CLIPTextModelWithProjection.from_pretrained(
"Xenova/clip-vit-base-patch32"
)
text_inputs = tokenizer([text], { padding: true, truncation: true })
textEmbeddings = await text_model(text_inputs)
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.
