w2v-server.pl: improve look and feel
diff --git a/w2v-server.pl b/w2v-server.pl
index 77065ab..4c95d9b 100644
--- a/w2v-server.pl
+++ b/w2v-server.pl
@@ -11,7 +11,7 @@
get '/' => sub {
my $c = shift;
my $word=$c->param('word');
- my $no_nbs=$c->param('n') || 50;
+ my $no_nbs=$c->param('n') || 100;
my $list;
if(defined($word) && $word !~ /^\s*$/) {
$c->inactivity_timeout(300);
@@ -184,8 +184,8 @@
<style>
svg {
// border: 1px solid #333;
-// margin-right: 5px;
-// margin-bottom: 5px;
+ margin-right: 10px;
+ margin-bottom:10px;
}
#wrapper {
width: 100%;
@@ -200,12 +200,20 @@
}
#second {
border: 1px solid #333;
+ height: 850px;
overflow: hidden; /* if you don't want #second to wrap below #first */
}
+#cost {
+ z-index: 1;
+ position: fixed;
+ font-size: 10px;
+ color: #222222;
+ margin-bottom: 10px;
+}
</style>
<script>
-var opt = {epsilon: 1, perplexity: 8};
+var opt = {epsilon: 1, perplexity: 20};
var T = new tsnejs.tSNE(opt); // create a tSNE instance
var Y;
@@ -278,11 +286,11 @@
function step() {
var i = T.iter;
- if(i >= 1000) {
+ if(i > 2000) {
stopStep();
} else {
- var cost = T.step(); // do a few steps
- $("#cost").html("iteration " + i + ", cost: " + cost);
+ var cost = Math.round(T.step() *1000) / 1000; // do a few steps
+ $("#cost").html("iteration " + i + ", cost: " + cost.toFixed(3));
updateEmbedding();
}
}
@@ -301,70 +309,58 @@
//step();
}
- $(window).xxload(function() {
- $.getJSON( "http://klinux10/word2vec/dings.json", function( j ) {
- data = j;
- T.initDataRaw(data.vecs); // init embedding
- drawEmbedding(); // draw initial embedding
-
- // T.debugGrad();
- iter_id = setInterval(step, 1);
- // step();
-
- });
- });
-
</script>
</head>
<body>
- <p>Word vector model based on DeReKo-2015-II. Trained with <a href="https://code.google.com/p/word2vec/">word2vec</a> using the following parameters:</p>
+ <form action="<%=url_for('/')->to_abs%>" method="GET">
+ Word: <input type="text" name="word" value="<%= $word %>">
+ Neighbours: <input type="text" name="n" value="<%= $no_nbs %>">
+ <input type="submit" value="Show neighbours">
+ </form>
+ <br>
+ % if($list) {
+ <div id="wrapper">
+ <table id="first">
+ <tr>
+ <th align="right">Pos.</th><th align="left">Word</th><th align="right">Cosine dist.</th>
+ </tr>
+ % my $i=1; my @words; my @vecs; for my $item (@$list) {
+ % push @vecs, $item->{vector};
+ % push @words, $item->{word};
+ <tr>
+ <td align="right">
+ <%= $i++ %>.
+ </td>
+ <td>
+ <a href="/?word=<%= $item->{word} %>">
+ <%= $item->{word} %>
+ </a>
+ </td>
+ <td align="right">
+ <%= sprintf("%.3f", $item->{dist}) %>
+ </td>
+ </tr>
+ % }
+ </table>
+ <script>
+ % use Mojo::ByteStream 'b';
+ $(window).load(function() {
+ showMap(<%= b(Mojo::JSON::to_json({target => $word, words => \@words, vecs => \@vecs})); %>);
+ });
+ </script>
+ % }
+ <div id="second" style="width:800px; height:800px; font-family: arial;">
+ <div id="embed">
+ </div>
+ <div id="cost"></div>
+ </div>
+ </div>
+ <p>
+ Word vector model based on DeReKo-2015-II. Trained with <a href="https://code.google.com/p/word2vec/">word2vec</a> using the following parameters:</p>
<pre>
-cbow 1 -size 300 -window 7 -negative 5 -hs 0 -sample 1e-5 -threads 44 -binary 1 -iter 5
-</pre>
-</p>
- <form action="<%=url_for('/')->to_abs%>" method="GET">
- Word: <input type="text" name="word" value="<%= $word %>">
- Neighbours: <input type="text" name="n" value="<%= $no_nbs %>">
- <input type="submit" value="Show neighbours">
- </form>
- <br>
- % if($list) {
- <h3>Nearest neighbours of "<%= $word %>"</h3>
-<div id="wrapper">
- <table id="first">
- <tr>
- <th align="right">Pos.</th><th align="left">Word</th><th align="right">Cosine dist.</th>
- </tr>
- % my $i=1; my @words; my @vecs; for my $item (@$list) {
- % push @vecs, $item->{vector};
- % push @words, $item->{word};
- <tr>
- <td align="right">
- <%= $i++ %>.
- </td>
- <td>
- <a href="/?word=<%= $item->{word} %>">
- <%= $item->{word} %>
- </a>
- </td>
- <td align="right">
- <%= sprintf("%.3f", $item->{dist}) %>
- </td>
- </tr>
- % }
- </table>
- <script>
- % use Mojo::ByteStream 'b';
-$(window).load(function() {
- showMap(<%= b(Mojo::JSON::to_json({target => $word, words => \@words, vecs => \@vecs})); %>);
-});
- </script>
- % }
-<div id="second" style="width:800px; height:800px; font-family: arial;">
-<div id="embed"></div>
-<div id="cost" style="text-align:left; font-family: Impact;"></div>
- </div>
- </div>
- </body>
+ </pre>
+ </p>
+</body>
</html>