Spaces:
Sleeping
Sleeping
File size: 1,968 Bytes
1ad4e76 8765030 1ad4e76 8765030 1ad4e76 8765030 1ad4e76 8765030 1ad4e76 8765030 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 | import { Grid } from "@mui/material";
import React from "react";
import Plot from "react-plotly.js";
const colors = [
"red",
"blue",
"green",
"orange",
"purple",
"brown",
"pink",
"grey",
"yellow",
"cyan",
];
export default function EmbeddingPlot({ words, x, y, z }) {
console.log(words);
return (
<>
<Grid item xs={12}>
<Plot
data={[
...words.map((word, index) => {
const color = colors[index % colors.length];
return {
x: [0, word.embedding[x]],
y: [0, word.embedding[y]],
z: [0, word.embedding[z]],
type: "scatter3d",
mode: "lines+markers",
line: {
width: 6,
},
marker: {
size: 1,
color: color,
},
name: word.item,
};
}),
...words.map((word, index) => {
const color = colors[index % colors.length];
return {
type: "cone",
x: [word.embedding[x]],
y: [word.embedding[y]],
z: [word.embedding[z]],
u: [word.embedding[x]],
v: [word.embedding[y]],
w: [word.embedding[z]],
sizemode: "absolute",
sizeref: 0.05,
showscale: false,
colorscale: [
[0, color],
[1, color],
],
};
}),
]}
layout={{
title: "3D Plot of Vectors",
scene: {
xaxis: { title: "X Axis" },
yaxis: { title: "Y Axis" },
zaxis: { title: "Z Axis" },
},
autosize: true,
}}
style={{ width: "100%", height: "100%" }}
/>
</Grid>
</>
);
}
|