From 981f5eca1e00ad38ba2951a887628ced9b79f49e Mon Sep 17 00:00:00 2001
From: Andrew Yan <ayan@usgs.gov>
Date: Fri, 26 Jan 2018 15:09:06 -0600
Subject: [PATCH] add data labels to median stat points
---
.../scripts/components/hydrograph/index.js | 24 +++++++++++++++++--
assets/src/scripts/models.js | 2 +-
2 files changed, 23 insertions(+), 3 deletions(-)
diff --git a/assets/src/scripts/components/hydrograph/index.js b/assets/src/scripts/components/hydrograph/index.js
index 29a5bbea5..15d3e7516 100644
--- a/assets/src/scripts/components/hydrograph/index.js
+++ b/assets/src/scripts/components/hydrograph/index.js
@@ -137,18 +137,38 @@ class Hydrograph {
}
_plotMedianPoints(plot, xScale, yScale) {
- plot.selectAll('circle')
+ plot.selectAll('medianPoint')
.data(this._medianStats)
.enter()
.append('circle')
.attr('r', '8px')
- .attr('fill', 'blue')
+ .attr('fill', 'yellow')
+ .attr('x', function(d) {
+ return xScale(d.time);
+ })
+ .attr('y', function(d) {
+ return yScale(d.value);
+ })
.attr('cx', function(d) {
return xScale(d.time);
})
.attr('cy', function(d) {
return yScale(d.value);
});
+
+ plot.selectAll('medianPointText')
+ .data(this._medianStats)
+ .enter()
+ .append('text')
+ .text(function(d) {
+ return d.label;
+ })
+ .attr('x', function(d) {
+ return xScale(d.time) + 10;
+ })
+ .attr('y', function(d) {
+ return yScale(d.value);
+ });
}
_plotTooltips(plot, xScale, yScale) {
diff --git a/assets/src/scripts/models.js b/assets/src/scripts/models.js
index 78cc68f29..facc84dbf 100644
--- a/assets/src/scripts/models.js
+++ b/assets/src/scripts/models.js
@@ -99,7 +99,7 @@ export function parseMedianData(medianData, timeSeries) {
let median = {
time: recordDate,
value: medianDatum.p50_va,
- label: `${formatTime(recordDate)}\n${medianDatum.p50_va} ${unit}`
+ label: `${medianDatum.p50_va} ${unit}`
};
// don't include leap days if it's not a leap year
if (!isLeapYear(recordDate.getFullYear())) {
--
GitLab