From f8c06b4e77152d08ed93fed62a819aa1eb1e7ced Mon Sep 17 00:00:00 2001
From: Mary Bucknell <mbucknell@usgs.gov>
Date: Tue, 13 Feb 2018 12:56:05 -0600
Subject: [PATCH] Added showMedianStatsLabel to Redux store and use it to
selectively display the median text labels.
---
.../scripts/components/hydrograph/index.js | 27 ++++++++++---------
.../scripts/components/hydrograph/store.js | 15 +++++++++--
2 files changed, 28 insertions(+), 14 deletions(-)
diff --git a/assets/src/scripts/components/hydrograph/index.js b/assets/src/scripts/components/hydrograph/index.js
index deef709d6..e79c8c679 100644
--- a/assets/src/scripts/components/hydrograph/index.js
+++ b/assets/src/scripts/components/hydrograph/index.js
@@ -130,7 +130,7 @@ const plotLegend = function(elem, {displayItems, width}) {
};
-const plotMedianPoints = function (elem, {visible, xscale, yscale, medianStatsData}) {
+const plotMedianPoints = function (elem, {visible, xscale, yscale, medianStatsData, showLabel}) {
elem.select('#median-points').remove();
if (!visible) {
@@ -155,20 +155,22 @@ const plotMedianPoints = function (elem, {visible, xscale, yscale, medianStatsDa
return yscale(d.value);
});
- container.selectAll('medianPointText')
- .data(medianStatsData)
- .enter()
- .append('text')
- .text(function(d) {
+ if (showLabel) {
+ container.selectAll('medianPointText').
+ data(medianStatsData).
+ enter().
+ append('text').
+ text(function(d) {
return d.label;
- })
- .attr('id', 'median-text')
- .attr('x', function(d) {
+ }).
+ attr('id', 'median-text').
+ attr('x', function(d) {
return xscale(d.time) + 5;
- })
- .attr('y', function(d) {
+ }).
+ attr('y', function(d) {
return yscale(d.value);
});
+ }
};
@@ -213,7 +215,8 @@ const timeSeriesGraph = function (elem) {
visible: isVisibleSelector('medianStatistics'),
xscale: xScaleSelector('current'),
yscale: yScaleSelector,
- medianStatsData: pointsSelector('medianStatistics')
+ medianStatsData: pointsSelector('medianStatistics'),
+ showLabel: (state) => state.showMedianStatsLabel
})));
elem.append('div')
diff --git a/assets/src/scripts/components/hydrograph/store.js b/assets/src/scripts/components/hydrograph/store.js
index b02b61471..38375fc92 100644
--- a/assets/src/scripts/components/hydrograph/store.js
+++ b/assets/src/scripts/components/hydrograph/store.js
@@ -72,6 +72,12 @@ export const Actions = {
medianStatistics
};
},
+ showMedianStatsLabel(show) {
+ return {
+ type: 'SHOW_MEDIAN_STATS_LABEL',
+ show
+ }
+ },
resizeTimeseriesPlot(width) {
return {
type: 'RESIZE_TIMESERIES_PLOT',
@@ -147,6 +153,12 @@ export const timeSeriesReducer = function (state={}, action) {
}
};
+ case 'SHOW_MEDIAN_STATS_LABEL':
+ return {
+ ...state,
+ showMedianStatsLabel : action.show
+ };
+
case 'RESIZE_TIMESERIES_PLOT':
return {
...state,
@@ -178,11 +190,10 @@ export const configureStore = function (initialState) {
compare: false,
medianStatistics: false
},
- legendMarkers: {},
- displayMarkers: [],
title: '',
desc: '',
width: 800,
+ showMedianStatsLabel: false,
...initialState
};
--
GitLab