Skip to content

Instantly share code, notes, and snippets.

@Fil

Fil/index.html Secret

Last active August 5, 2018 20:43
Show Gist options
  • Save Fil/ee79c135db0c3451d4f44c60925e9466 to your computer and use it in GitHub Desktop.
Save Fil/ee79c135db0c3451d4f44c60925e9466 to your computer and use it in GitHub Desktop.
tfjs-tsne test
<canvas id=canvas width=960 height=500></canvas>
<script src="https://unpkg.com/@tensorflow/tfjs"></script>
<script src="https://unpkg.com/@tensorflow/tfjs-tsne"></script>
<script>
(async function() {
const width = 960,
height = (width * 2) / 3,
context = document.getElementById("canvas").getContext("2d");
const data = tf.randomUniform([1024, 3]);
const ts = tsne.tsne(data, { perplexity: 10 });
const knnIterations = ts.knnIterations();
// Do the KNN computation. This needs to complete before we run tsne
for (let i = 0; i < knnIterations; ++i) {
console.log("iterate Knn", i, "/", knnIterations);
await ts.iterateKnn();
//yield ts.coordsArray();
}
const tsneIterations = 100;
for (let i = 0; i < tsneIterations; ++i) {
await ts.iterate(10);
// Draw the embedding here...
draw(await ts.coordsArray());
}
function draw(coords) {
context.fillStyle= 'rgba(255,255,255,0.7)';
context.fillRect(0, 0, width, height);
coords.forEach((point, i) => {
context.beginPath(),
context.arc(point[0] * width, point[1] * height, 8, 0, 2 * Math.PI),
(context.fillStyle = `rgb(${data.get(i, 0) * 255},${data.get(i, 1) *
255},${data.get(i, 2) * 255})`),
context.fill();
});
}
})();
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment