diff --git a/templates/index.html.ep b/templates/index.html.ep
index c841262..6b5c4b8 100644
--- a/templates/index.html.ep
+++ b/templates/index.html.ep
@@ -56,7 +56,7 @@
 				 
 				 if (collocatorData != null) {
 						 var t = $('#secondtable').DataTable({
-								 data: collocatorData,
+                 data: collocatorData,
 								 "sScrollY": "800px",
 								 "bScrollCollapse": true,
 								 "bPaginate": false,
@@ -85,13 +85,17 @@
 								 ],
 								 "order": [[ 4, 'desc' ]],
 						 } );
+
 						 t.on( 'order.dt search.dt', function () {
 								 t.column(0, {order:'applied'}).nodes().each( function (cell, i) {
 										 cell.innerHTML = i+1;
 								 } );
 						 } ).draw();
 				 }
+				 $("#tabs").css("visibility", "visible"); // now we can show the tabs
+
 		 });
+
 		 $(function(){
 				 $("#dropdownoptions").dialog({
 						 title: "Options",
@@ -178,6 +182,7 @@
 				 });
 		 } );
 
+		 var tabactivated = {}
      $( function() {
 				 $( "#tabs" ).tabs().addClass('tabs-min');
 		 } );
@@ -194,7 +199,7 @@
 								 return $(this).attr('title');
 						 }}
 				 )
-	   })
+		 })
 
     </script>
 	  <script src="//d3js.org/d3.v3.min.js" charset="utf-8"></script>
@@ -430,8 +435,8 @@
 								T.Y[i][0] = (d.x - mapWidth/2 - tx)/ss/20;
 								T.Y[i][1] = (d.y - mapHeight/2 - ty)/ss/20;
 								return "translate(" +
-									(d.x) + "," +
-									(d.y) + ")";
+											(d.x) + "," +
+											(d.y) + ")";
 						});
      }
 
@@ -441,8 +446,8 @@
 						.data(data.words)
 						.attr("transform", function(d, i) {
 								return "translate(" +
-									 ((Y[i][0]*20*ss + tx) + mapWidth/2) + "," +
-									 ((Y[i][1]*20*ss + ty) + mapHeight/2) + ")"; });
+											 ((Y[i][0]*20*ss + tx) + mapWidth/2) + "," +
+											 ((Y[i][1]*20*ss + ty) + mapHeight/2) + ")"; });
      }
 
      var svg;
@@ -628,7 +633,7 @@
 					<input id="SEARCH" type="button" value="SEARCH">
 					<input type="button" id="showoptions" name="showoptions" value="Options" />
 				</form>
-				<div id="dropdownoptions" style="display: hidden">
+				<div id="dropdownoptions" style="display: none">
 					<form id="optionsform">
 						<div class="controlgroup-vertical">
 							<label for="cutoff">cut-off</label>
@@ -660,7 +665,7 @@
 			</div>
 		</div>
 		<div id="topwrapper">
-			<div id="tabs">
+			<div style="visibility: hidden;" id="tabs">
 				<ul>
 					<li><a href="#tabs-1">Semantics (TSNE-map)</a></li>
 					<li><a href="#tabs-2">Semantics (SOM)</a></li>
@@ -726,6 +731,7 @@
 							 % use Mojo::ByteStream 'b';
 							 % my $urlprefix = url_with->query([word=>'']);
 							 $(window).load(function() {
+									 var vecs = <%= b(Mojo::JSON::to_json($lists->[0])) %>;
 									 showMap(<%= b(Mojo::JSON::to_json({target => " $word ", mergedEnd=> $mergedEnd, words => \@words, vecs => \@vecs, ranks => \@ranks, marked => \@marked, urlprefix => $urlprefix})); %>);
 							 });
 							</script>
@@ -772,7 +778,7 @@
 					<div id="sominfo">SOM iteration <span id="iterations">0</span></div>
         </div>
 				<div id="tabs-3">
-					<div id="second" style="width:500px">
+					<div style="width: 800px" id="secondt">
 						<table class="display compact nowrap" id="secondtable">
 							<thead>
 								<tr>