new

frontend/src/components/Heatmap.vue

@@ -185,7 +185,7 @@ export default {
         .style("visibility", "hidden");
     // define the zoomListener which calls the zoom function on the "zoom" event constrained within the scaleExtents
     const zoom = d3.zoom()
-                        .scaleExtent([0.1, 3]) //zoom limit
+                        .scaleExtent([0.4, 3]) //zoom limit
                         .on('zoom', () => {
                             svg.attr('transform', d3.event.transform) // updated for d3 v4
                         })
@@ -223,7 +223,7 @@ export default {
           .call(zoom)
             //.call(zoom.transform, d3.zoomIdentity.translate(200, 20).scale(0.25)) //initial size
             .append('svg:g')
-            .attr("transform", "translate(" + viewerPosLeft + "," + viewerPosTopHeat + ")");
+            .attr("transform", "scale(1.5,1.5) translate(" + viewerPosLeft + "," + viewerPosTopHeat + ")");
 
       svg.append('defs')
           .append('pattern')
@@ -324,8 +324,8 @@ export default {
             return d.idx;
           })
           .attr("class", "row");
-          svg.append("text").attr("x", 10).attr("y", -65).text("Technique").style("font-size", "16px").attr("alignment-baseline","top")
-          svg.append("text").attr("transform", "rotate(-90)").attr("x", (-1)*(cellSize*(len/2))).attr("y", -75).style("text-anchor", "middle").style("font-size", "16px").text("Feature"); // -130 before for HeartC
+          svg.append("text").attr("x", 10).attr("y", -65).text("Technique").style("font-size", "14px").attr("alignment-baseline","top")
+          svg.append("text").attr("transform", "rotate(-90)").attr("x", (-1)*(cellSize*(len/2))).attr("y", -75).style("text-anchor", "middle").style("font-size", "14px").text("Feature"); // -130 before for HeartC
           var heatMap = row.selectAll(".cell")
           .data(function(d) {
               return d;

frontend/src/components/Results.vue

@@ -36,7 +36,7 @@ export default {
 
       var margin = {top: 0, right: 0, bottom: 0, left: 0}
       var width = 390 - margin.left - margin.right
-      var height = 570 - margin.top - margin.bottom
+      var height = 620 - margin.top - margin.bottom
       var padding = 3
       var xLabelHeight = 30
       var yLabelWidth = 80
@@ -362,7 +362,7 @@ export default {
         barmode: 'group',
         autosize: false,
         width: '400',
-        height: '350',
+        height: '300',
         margin: {
           l: 55,
           r: 5,
@@ -373,7 +373,7 @@ export default {
         legend:{
           xanchor:"center",
           yanchor:"top",
-          y:-0.2, // play with it
+          y:-0.3, // play with it
           x:0.5,   // play with it
           orientation: "h"
         }