Mforns has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/348227 )
Change subject: Add annotations to tabs layout
......................................................................
Add annotations to tabs layout
Bug: T162482
Change-Id: I5d0c9cab72aa713c7f0e6cd7b1f1d832c7aca5b8
---
M src/app/apis/aqs-api.js
M src/components/layouts/tabs/tabs.js
M src/components/visualizers/dygraphs-timeseries/bindings.js
M src/components/visualizers/visualizer/visualizer.js
M src/layouts/tabs/styles.css
5 files changed, 46 insertions(+), 4 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/analytics/dashiki
refs/changes/27/348227/1
diff --git a/src/app/apis/aqs-api.js b/src/app/apis/aqs-api.js
index 8f339d2..280dbf9 100644
--- a/src/app/apis/aqs-api.js
+++ b/src/app/apis/aqs-api.js
@@ -92,7 +92,7 @@
// Datasets are disjoint but we need to add them so that
// the timeseries object makes sense.
- var ts = TimeseriesData.mergeAll(timeseries)
+ var ts = TimeseriesData.mergeAll(timeseries);
deferred.resolve(ts);
}, function (reason) {
diff --git a/src/components/layouts/tabs/tabs.js
b/src/components/layouts/tabs/tabs.js
index 6866983..3f0edc8 100644
--- a/src/components/layouts/tabs/tabs.js
+++ b/src/components/layouts/tabs/tabs.js
@@ -7,7 +7,8 @@
var ko = require('knockout'),
_ = require('lodash'),
templateMarkup = require('text!./tabs.html'),
- configApi = require('apis.config');
+ configApi = require('apis.config'),
+ annotationsApi = require('apis.annotations');
require('twix');
@@ -64,6 +65,15 @@
g.type === 'stacked-bars' ? 'bar' :
g.type === 'dygraphs-timeseries' ? 'line' :
g.type === 'table-timeseries' ? 'table' : '';
+
+ // Fetch annotations if present
+ var annotationsInfo = g.annotations;
+ g.annotations = ko.observable();
+ if (annotationsInfo) {
+ annotationsApi.getTimeseriesData(
+ {annotations: annotationsInfo}
+ ).then(g.annotations);
+ }
});
}, this);
diff --git a/src/components/visualizers/dygraphs-timeseries/bindings.js
b/src/components/visualizers/dygraphs-timeseries/bindings.js
index 78d5692..201b8d2 100644
--- a/src/components/visualizers/dygraphs-timeseries/bindings.js
+++ b/src/components/visualizers/dygraphs-timeseries/bindings.js
@@ -75,12 +75,14 @@
dygraphChart.ready(function () {
var i = 0,
$roller = $(dygraphChart.roller_),
- $rollerHolder = $('<span
class="dygraph-roller">Averaging: </span>');
+ $rollerHolder = $('<span
class="dygraph-roller">Averaging: </span>')
+ charCode = 65;
dygraphChart.setAnnotations(annotations.rowData().map(function (a) {
// find the closest date in the data that fits
var closestDate = null;
var lastDistance = Math.pow(2, 53) - 1;
+
for (; i < rows.length; i++) {
var date = rows[i][0];
var thisDistance = Math.min(lastDistance,
Math.abs(date.getTime() - a[0]));
@@ -103,7 +105,7 @@
// just attach to the first series and show on
X axis
series: options.labels[1],
attachAtBottom: true,
- shortText: 'A',
+ shortText: String.fromCharCode(charCode++),
// annoying thing to learn through
experimentation:
// Dygraphs requires Date instances for the
data, but
// Dygraphs requires milliseconds since
epoch for the annotations
diff --git a/src/components/visualizers/visualizer/visualizer.js
b/src/components/visualizers/visualizer/visualizer.js
index 19002a9..e28204b 100644
--- a/src/components/visualizers/visualizer/visualizer.js
+++ b/src/components/visualizers/visualizer/visualizer.js
@@ -141,6 +141,7 @@
format: numberUtils.numberFormatter(graph.format),
height: 500,
id: _.kebabCase([graph.metric, graph.submetric].join('-')),
+ annotations: graph.annotations,
};
this.params.downloadLink = graph.downloadLink;
this.legendHeight = this.params.height - 80 + 'px';
diff --git a/src/layouts/tabs/styles.css b/src/layouts/tabs/styles.css
index 94d181b..c35ba52 100644
--- a/src/layouts/tabs/styles.css
+++ b/src/layouts/tabs/styles.css
@@ -82,3 +82,32 @@
font-size: 11px!important;
padding-right: 4px!important;
}
+
+/* Patches appearance of annotations */
+.dygraphDefaultAnnotation {
+ top: 0 !important;
+ height: calc(100% - 1.8em) !important;
+ width: 0 !important;
+ border-left: 0.05em dashed !important;
+ border-right-style: none !important;
+ border-top-style: none !important;
+ border-bottom-style: none !important;
+ background-color: transparent !important;
+ margin-left: 0.53em !important;
+ padding-left: 0.15em !important;
+ overflow: visible !important;
+}
+
+/* Presence of annotations messes with the averaging days control */
+.dygraph-roller input {
+ position: relative !important;
+ left: auto !important;
+ top: auto !important;
+ display: inline !important;
+}
+
+/* Presence of annotations needs to modify position of the legend */
+.dygraph-legend {
+ z-index: 15 !important;
+ top: 1.5em !important;
+}
--
To view, visit https://gerrit.wikimedia.org/r/348227
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I5d0c9cab72aa713c7f0e6cd7b1f1d832c7aca5b8
Gerrit-PatchSet: 1
Gerrit-Project: analytics/dashiki
Gerrit-Branch: master
Gerrit-Owner: Mforns <mfo...@wikimedia.org>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
