Merge branch '19744-acr-crunchstat' refs #19744

[arvados.git] / tools / crunchstat-summary / crunchstat_summary / dygraphs.js

diff --git a/tools/crunchstat-summary/crunchstat_summary/dygraphs.js b/tools/crunchstat-summary/crunchstat_summary/dygraphs.js
index 52e5534ef179f1124c90084e68596b8a43bf08e4..76c92107042bf9663324489c6e5ed9a0d4576981 100644 (file)
--- a/tools/crunchstat-summary/crunchstat_summary/dygraphs.js
+++ b/tools/crunchstat-summary/crunchstat_summary/dygraphs.js
@@ -40,9 +40,7 @@ window.onload = function() {
         },
     }
     chartdata.forEach(function(section, section_idx) {
-        var h1 = document.createElement('h1');
-        h1.appendChild(document.createTextNode(section.label));
-        document.body.appendChild(h1);
+        var chartDiv = document.getElementById("chart");
         section.charts.forEach(function(chart, chart_idx) {
             // Skip chart if every series has zero data points
             if (0 == chart.data.reduce(function(len, series) {
@@ -54,7 +52,7 @@ window.onload = function() {
             var div = document.createElement('div');
             div.setAttribute('id', id);
             div.setAttribute('style', 'width: 100%; height: 150px');
-            document.body.appendChild(div);
+            chartDiv.appendChild(div);
             chart.options.valueFormatter = function(y) {
             }
             chart.options.axes = {
@@ -68,6 +66,17 @@ window.onload = function() {
                     valueFormatter: fmt.iso,
                 },
             }
+            var div2 = document.createElement('div');
+            div2.setAttribute('style', 'width: 150px; height: 150px');
+            chart.options.labelsDiv = div2;
+            chart.options.labelsSeparateLines = true;
+
+            var div3 = document.createElement('div');
+            div3.setAttribute('style', 'display: flex; padding-bottom: 16px');
+            div3.appendChild(div);
+            div3.appendChild(div2);
+            chartDiv.appendChild(div3);
+
             charts[id] = new Dygraph(div, chart.data, chart.options);
         });
     });