w2v-server.pl: add jitter
diff --git a/w2v-server.pl b/w2v-server.pl
index d10325f..181c185 100644
--- a/w2v-server.pl
+++ b/w2v-server.pl
@@ -5,6 +5,7 @@
use Encode qw(decode encode);
use Mojo::Server::Daemon;
+print STDERR $ARGV[0];
# -cbow 1 -size 200 -window 8 -negative 25 -hs 0 -sample 1e-4 -threads 40 -binary 1 -iter 15
init_net("vectors15.bin");
@@ -204,6 +205,7 @@
</script>
<script src="//d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="http://klinux10/word2vec/tsne.js"></script>
+ <script src="http://klinux10/word2vec/labeler.js"></script>
<style>
body, input {
font-family: Arial, sans-serif;
@@ -256,17 +258,38 @@
var Y;
var data;
+var labeler;
+
+function applyJitter() {
+ svg.selectAll('.u')
+ .data(labels)
+ .transition()
+ .duration(50)
+ .attr("transform", function(d, i) {
+ T.Y[i][0] = (d.x - 400 - tx)/ss/20;
+ T.Y[i][1] = (d.y - 400 - ty)/ss/20;
+ return "translate(" +
+ (d.x) + "," +
+ (d.y) + ")";
+ });
+}
+
function updateEmbedding() {
var Y = T.getSolution();
svg.selectAll('.u')
.data(data.words)
- .attr("transform", function(d, i) { return "translate(" +
- ((Y[i][0]*20*ss + tx) + 400) + "," +
- ((Y[i][1]*20*ss + ty) + 400) + ")"; });
+ .attr("transform", function(d, i) {
+ return "translate(" +
+ ((Y[i][0]*20*ss + tx) + 400) + "," +
+ ((Y[i][1]*20*ss + ty) + 400) + ")"; });
}
var svg;
+var labels = [];
+var anchor_array = [];
+var text;
+
function drawEmbedding() {
$("#embed").empty();
var div = d3.select("#embed");
@@ -319,10 +342,54 @@
}
var stepnum = 0;
-
+
function stopStep() {
clearInterval(iter_id);
+ text = svg.selectAll("text");
+
+ labels = d3.range(data.words.length).map(function(i) {
+ var x = (T.Y[i][0]*20*ss + tx) + 400;
+ var y = (T.Y[i][1]*20*ss + ty) + 400;
+ anchor_array.push({x: x, y: y, r: 5});
+ return {
+ x: x,
+ y: y,
+ name: data.words[i]
+ };
+ });
+
+ var index = 0;
+ text.each(function() {
+ labels[index].width = this.getBBox().width;
+ labels[index].height = this.getBBox().height;
+ index += 1;
+ });
+
+
+// setTimeout(updateEmbedding, 1);
+// setTimeout(
+ labeler = d3.labeler()
+ .label(labels)
+ .anchor(anchor_array)
+ .width(800)
+ .height(800)
+ .update(applyJitter);
+// .start(1000);
+
+ iter_id = setInterval(jitterStep, 1);
+
}
+
+var jitter_i=0;;
+
+function jitterStep() {
+ if(jitter_i++ > 100) {
+ clearInterval(iter_id);
+ } else {
+ labeler.start2(10);
+ applyJitter();
+ }
+}
function step() {
var i = T.iter;
@@ -334,7 +401,7 @@
updateEmbedding();
}
}
-
+
function showMap(j) {
data=j;
T.iter=0;
@@ -349,6 +416,13 @@
//step();
}
+ function update() {
+
+ text.transition().duration(800)
+ .attr("transform", transform);
+ }
+
+
</script>
</head>
<body>