highlight medv; fix SVG height

3 files changed, 11 insertions, 5 deletions

diff --git a/code/weightviswrapper.js b/code/weightviswrapper.js
index 94f6306..ca31916 100644
--- a/code/weightviswrapper.js
+++ b/code/weightviswrapper.js
@@ -17,7 +17,7 @@ var WeightVisWrapper = (function() {
         this.svgContainer
             .style("margin-top", "1.5em")
             .style("margin-bottom", "1em")
-            .style("height", "100%")
+            .style("height", "85%") // TODO find optimal height
             .style("width", "100%");
 
         this.spinner = this.container.append("div")
diff --git a/index.css b/index.css
index 3994932..d102771 100644
--- a/index.css
+++ b/index.css
@@ -44,6 +44,9 @@ table.center {
     padding-left: 1em !important;
     padding-right: 1em !important;
 }
+#boston-example .table-highlight {
+    background-color: #82B1FF;
+}
 
 .hidden {
     display: none;
diff --git a/index.html b/index.html
index 5308008..8684d38 100644
--- a/index.html
+++ b/index.html
@@ -185,7 +185,9 @@
                     var table = d3.select("#boston-example");
                     table.attr("class", "center mdl-data-table mdl-js-data-table");
                     var htr = table.append("thead").append("tr")
-                    bostonset.attributes().forEach(function(attr) {
+                    var attrs = bostonset.attributes();
+                    var medv = attrs.indexOf("medv");
+                    attrs.forEach(function(attr) {
                         var th = htr.append("th")
                             .html(attr)
                             .attr("class", "mdl-data-table__cell--non-numeric");
@@ -196,9 +198,10 @@
                     for(c=0; c<5; c++) {
                         var row = Math.floor(Math.random()*bostonset.length());
                         var tr = table.select("tbody").append("tr");
-                        bostonset.rawData(row).forEach(function(val) {
-                            tr.append("td").text(val);
-                        });
+                        for (a=0; a<attrs.length; a++) {
+                            var td = tr.append("td").text(bostonset.rawData(row)[a]);
+                            if (a == medv) td.attr("class", "table-highlight");
+                        }
                     }
                     componentHandler.upgradeElement(table.node());
                 });