From a98d0c5be48c97885bb71c3fd2b10affc5901f42 Mon Sep 17 00:00:00 2001 From: Noah Callaway Date: Mon, 9 Mar 2020 21:55:58 -0700 Subject: [PATCH 01/30] Issue 818: Add legend to map view --- src/components/main/index.js | 10 ++++- src/components/map/map.js | 5 +++ src/components/tree/legend/legend.js | 67 ++++++++++++++++++++-------- src/components/tree/tree.js | 6 +-- src/reducers/controls.js | 8 +++- 5 files changed, 72 insertions(+), 24 deletions(-) diff --git a/src/components/main/index.js b/src/components/main/index.js index f6c8b5deb..8aa27ff41 100644 --- a/src/components/main/index.js +++ b/src/components/main/index.js @@ -77,6 +77,14 @@ class Main extends React.Component { toggleSidebar() { this.props.dispatch({type: TOGGLE_SIDEBAR, value: !this.props.sidebarOpen}); } + + shouldShowMapLegend() { + const showingTree = this.props.panelsToDisplay.includes("tree"); + const inGrid = this.props.panelLayout !== "grid"; + + return !showingTree || inGrid; + } + render() { if (this.state.showSpinner) { return (); @@ -133,7 +141,7 @@ class Main extends React.Component { } {this.props.displayNarrative || this.props.showOnlyPanels ? null : } {this.props.panelsToDisplay.includes("tree") ? : null} - {this.props.panelsToDisplay.includes("map") ? : null} + {this.props.panelsToDisplay.includes("map") ? : null} {this.props.panelsToDisplay.includes("entropy") ? ( diff --git a/src/components/map/map.js b/src/components/map/map.js index 65614005e..3334ad61d 100644 --- a/src/components/map/map.js +++ b/src/components/map/map.js @@ -20,6 +20,8 @@ import { MAP_ANIMATION_PLAY_PAUSE_BUTTON } from "../../actions/types"; // import { incommingMapPNG } from "../download/helperFunctions"; import { timerStart, timerEnd } from "../../util/perf"; import { tabSingle, darkGrey, lightGrey, goColor, pauseColor } from "../../globalStyles"; +import ErrorBoundary from "../../util/errorBoundry"; +import Legend from "../tree/legend/legend"; /* global L */ // L is global in scope and placed by leaflet() @@ -640,6 +642,9 @@ class Map extends React.Component { // clear layers - store all markers in map state https://github.com/Leaflet/Leaflet/issues/3238#issuecomment-77061011 return ( + {this.props.legend && + + } {this.maybeCreateMapDiv()} {this.props.narrativeMode ? null : (