\n Examples:{\" \"}\n {[\n {\n title: \"Apples and bananas are really different\",\n q: \"/?word=apples&word=oranges&word=bananas&word=grapefruit&word=blueberry&word=blackberry&word=raspberry&word=\",\n },\n {\n title: \"Lexus is way different from Tesla\",\n q: \"/?word=porsche&word=ferrari&word=tesla&word=kia&word=lexus&word=toyota&word=hyundai&word=\",\n },\n {\n title: \"Cats and dogs are more similar to each other than to canine and feline\",\n q: \"/?word=dog&word=cat&word=feline&word=canine&word=&word=&word=&word=\",\n },\n {\n title: \"Chess pieces wtf\",\n q: \"/?word=pawn&word=king&word=queen&word=rook&word=castle&word=&word=&word=\",\n },\n ].map((ex, i, arr) => {\n return (\n <>\n {ex.title}\n {i === arr.length - 1 ? \"\" : \", \"}\n \n )\n })}\n

\n\n// Based on https://github.com/Shawns2759/vector-similarity MIT\nfunction dotProduct(a: number[], b: number[]): number {\n return a.reduce((sum, value, index) => sum + value * b[index], 0)\n}\n\nfunction vectorMagnitude(a: number[]): number {\n return Math.sqrt(a.reduce((sum, value) => sum + value * value, 0))\n}\n\nfunction cosineSimilarity(a: number[], b: number[]): number {\n const dotProd = dotProduct(a, b)\n const magnitudeA = vectorMagnitude(a)\n const magnitudeB = vectorMagnitude(b)\n return dotProd / (magnitudeA * magnitudeB)\n}\n\nconst app = new Hono()\napp.get(\"/\", async (c) => {\n if (working) {\n return c.text(\"Sorry, another embedding is being fetched, wait a moment and try again\")\n }\n\n working = true\n const inputQ = c.req.queries(\"word\")\n const items = (inputQ ?? []).filter(Boolean)\n const inputResult = v.safeParse(inputSchema, items)\n\n if (inputResult.success) {\n const input = inputResult.output\n const embeddings = await client.embed({\n input,\n model: \"voyage-3-lite\",\n })\n\n const zipped = input.map((word, i) => {\n return {\n word,\n embedding: embeddings.data?.at(i)?.embedding,\n }\n })\n\n const data = {\n nodes: zipped.map(z => {\n return {\n id: z.word,\n }\n }),\n links: zipped.flatMap((z, i) => {\n return zipped.slice(i + 1).map(z2 => {\n return {\n source: z.word,\n target: z2.word,\n value: cosineSimilarity(z.embedding, z2.embedding),\n }\n })\n }),\n }\n\n setTimeout(() => {\n working = false\n }, THROTTLE)\n\n return c.html(\n \n \n Surprising embeddings\n \n \n \n

Surprising embeddings

\n \n \n \n

\n\n \n\n {examples}\n

\n\n \n \n ,\n )\n }\n\n return c.html(\n \n \n Surprising embeddings\n \n \n \n

Surprising embeddings

\n\n \n\n {examples}\n

\n \n \n ,\n )\n})\n\nexport default app.fetch","surprising-embeddings",[],[175],{"_103":185,"_95":186,"_154":187,"_156":-5,"_157":139,"_158":100,"_160":22,"_105":188,"_99":189,"_164":190,"_166":191,"_168":22,"_169":-5,"_170":192,"_98":193},"e869c468-da91-11ef-8e0f-e6cdfca9ef9f","visualization","83d70fb2-da85-11ef-a00c-e6cdfca9ef9f",["D",1737750567603],138,"script","import * as d3 from \"https://cdn.jsdelivr.net/npm/d3@7.9.0/+esm\"\n\nconst width = document.querySelector(\"main\").offsetWidth\nconst dataText = document.querySelector(\"#data\").innerHTML\nconsole.log(dataText)\n\nconst data = JSON.parse(\n dataText,\n)\n// Specify the dimensions of the chart.\nconst height = 700\n\n// Specify the color scale.\nconst color = d3.scaleOrdinal(d3.schemeCategory10)\n\n// The force simulation mutates links and nodes, so create a copy\n// so that re-evaluating this cell produces the same result.\nconst links = data.links.map((d) => ({ ...d }))\nconst nodes = data.nodes.map((d) => ({ ...d }))\n\nconst valueRange = d3.extent(data.links, d => d.value)\nconst scale = d3.scaleLinear().domain(valueRange).range([1, 30])\nconst opacityScale = d3.scaleLinear().domain(valueRange).range([0.1, 1])\nconst distanceScale = d3.scaleLinear().domain(valueRange).range([width, width / 10])\n\nconst positions = Array.from({ length: nodes.length }, (_, i) => {\n return {\n x: (Math.cos((i / nodes.length) * Math.PI * 2) * width / 3) + width / 2,\n y: (Math.sin((i / nodes.length) * Math.PI * 2) * width / 3) + width / 2,\n }\n})\n\n// Create a simulation with several forces.\nconst simulation = d3\n .forceSimulation(nodes)\n .force(\n \"link\",\n d3\n .forceLink(links)\n .id((d) => d.id)\n .distance((d) => {\n return width / 2\n // return distanceScale(d.value)\n }),\n )\n .force(\"charge\", d3.forceManyBody())\n .force(\"center\", d3.forceCenter(width / 2, height / 2))\n\n// Create the SVG container.\nconst svg = d3\n .create(\"svg\")\n .attr(\"width\", width)\n .attr(\"height\", height)\n .attr(\"viewBox\", [0, 0, width, height])\n .attr(\"style\", \"max-width: 100%; height: auto;\")\n\n// Add a line for each link, and a circle for each node.\nconst link = svg\n .append(\"g\")\n .selectAll()\n .data(links)\n .join(\"line\")\n .attr(\"stroke-opacity\", d => opacityScale(d.value))\n .attr(\"stroke\", d => {\n return d3.interpolateLab(color(d.source.id), color(d.target.id))(0.5)\n })\n .attr(\"stroke-width\", (d) => scale(d.value))\n\nconst node = svg\n .append(\"g\")\n .selectAll()\n .data(nodes)\n .join(\"g\")\n .attr(\"transform\", (d, i) => `translate(${positions[i].x}, ${positions[i].y})`)\n\nnode\n .append(\"circle\")\n .attr(\"r\", 50)\n .attr(\"stroke\", \"#fff\")\n .attr(\"stroke-width\", 1.5)\n .attr(\"fill\", (d) => color(d.id))\n\nnode\n .append(\"text\")\n .attr(\"x\", 0)\n .attr(\"text-anchor\", \"middle\")\n .attr(\"font-size\", 14)\n .attr(\"font-weight\", \"bold\")\n .attr(\"fill\", \"white\")\n .attr(\"y\", \"0.31em\")\n .text(d => d.id)\n .clone(true).lower()\n .attr(\"fill\", \"none\")\n .attr(\"stroke\", \"black\")\n .attr(\"stroke-width\", 3)\n\nnode.append(\"title\").text((d) => d.id)\n\nnode.on(\"mouseenter\", e => {\n link.attr(\"opacity\", l => {\n const d = d3.select(e.target).data()[0]\n return (l.source.id === d.id || l.target.id === d.id) ? 1 : 0.1\n })\n})\n\nnode.on(\"mouseleave\", d => {\n link.attr(\"opacity\", d => opacityScale(d.value))\n})\n\ndocument.querySelector(\"#root\").appendChild(svg.node())\n\nconsole.log(data)",[],[186],"files",[151,173,184],"counts",{"_198":32,"_199":119,"_200":32,"_201":119},"pulls","branches","forks","envVars","contents",[204,207,210],{"_103":152,"_95":153,"_154":155,"_156":-5,"_157":139,"_158":159,"_160":161,"_105":205,"_99":163,"_164":165,"_166":167,"_168":22,"_169":-5,"_98":206},["D",1737738093468],[153],{"_103":174,"_95":175,"_154":176,"_156":-5,"_157":139,"_158":177,"_160":22,"_105":208,"_99":179,"_164":165,"_166":180,"_168":22,"_169":181,"_98":209},["D",1737750290081],[175],{"_103":185,"_95":186,"_154":187,"_156":-5,"_157":139,"_158":100,"_160":22,"_105":211,"_99":189,"_164":190,"_166":191,"_168":22,"_169":-5,"_98":212},["D",1737750567603],[186],"file","upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.version.$version.code.$",{"_93":94,"_95":96,"_97":43,"_99":100,"_98":72,"_101":222,"_149":227,"_194":237,"_213":-7,"_202":238,"_245":-5,"_246":22,"_247":-5,"_248":-5,"_249":-5,"_250":251},{"_103":104,"_95":96,"_105":223,"_107":-5,"_108":22,"_109":110,"_111":112,"_113":-5,"_14":114,"_115":-5,"_116":22,"_117":-5,"_118":119,"_16":120,"_121":122,"_123":122,"_124":125,"_126":125,"_127":125,"_128":122,"_129":122,"_23":224,"_133":225,"_136":226,"_148":22},["D",1737736218273],{"_93":94,"_131":132},{"_93":94,"_135":132},{"_99":138,"_95":43,"_103":139,"_140":104,"_141":-5,"_142":-5,"_143":-5,"_144":-5,"_145":-5,"_146":96,"_147":94},[228,231,234],{"_103":152,"_95":153,"_154":155,"_156":-5,"_157":139,"_158":159,"_160":161,"_105":162,"_99":163,"_164":165,"_166":167,"_168":22,"_169":-5,"_170":229,"_98":230},[],[153],{"_103":174,"_95":175,"_154":176,"_156":-5,"_157":139,"_158":177,"_160":22,"_105":178,"_99":179,"_164":165,"_166":180,"_168":22,"_169":181,"_170":232,"_98":233},[],[175],{"_103":185,"_95":186,"_154":187,"_156":-5,"_157":139,"_158":100,"_160":22,"_105":188,"_99":189,"_164":190,"_166":191,"_168":22,"_169":-5,"_170":235,"_98":236},[],[186],[228,231,234],[239,241,243],{"_103":152,"_95":153,"_154":155,"_156":-5,"_157":139,"_158":159,"_160":161,"_105":205,"_99":163,"_164":165,"_166":167,"_168":22,"_169":-5,"_98":240},[153],{"_103":174,"_95":175,"_154":176,"_156":-5,"_157":139,"_158":177,"_160":22,"_105":208,"_99":179,"_164":165,"_166":180,"_168":22,"_169":181,"_98":242},[175],{"_103":185,"_95":186,"_154":187,"_156":-5,"_157":139,"_158":100,"_160":22,"_105":211,"_99":189,"_164":190,"_166":191,"_168":22,"_169":-5,"_98":244},[186],"upstream","showCompareCallout","pull","ahead","behind","templates",[],"actionData","errors"]

tmcw

surprisingEmbeddings