diff --git a/src/client/components/Pie.js b/src/client/components/Pie.js index d58d6a29612e96c40df9fe7b8e61ec13cfb7ee56..f7430e76b730bf46410d0613f0dca2076f2b0f77 100644 --- a/src/client/components/Pie.js +++ b/src/client/components/Pie.js @@ -65,6 +65,9 @@ const combineSmallGroups = (dataArray) => { let Pie = (props) => { const { classes, data, query } = props; const resultCount = data.length; + if (resultCount < 1) { + return ''; + } const grouped = _.groupBy(data,'typeLabel'); let dataArray = []; for (let key in grouped) { diff --git a/src/client/containers/MapApp.js b/src/client/containers/MapApp.js index d7ed78f9f7208bcffd5c0a2c3c372cbf7661e8d1..6d00730a516656bd2ff75730cffc5da9e7bb7778 100644 --- a/src/client/containers/MapApp.js +++ b/src/client/containers/MapApp.js @@ -11,6 +11,7 @@ import Grid from '@material-ui/core/Grid'; import Immutable from 'immutable'; import VirtualizedTable from '../components/VirtualizedTable'; import LeafletMap from '../components/map/LeafletMap'; +import Pie from '../components/Pie'; import { getVisibleResults, @@ -55,6 +56,9 @@ const styles = theme => ({ mainContainer: { marginTop: 64, height: 'calc(100% - 64px)' + }, + map: { + height: '50%' } }); @@ -62,34 +66,6 @@ let MapApp = (props) => { const { classes, error, analysisView } = props; console.log(props.results); - const resultsSection = ( - <VirtualizedTable - list={Immutable.List(props.results)} - resultValues={props.resultValues} - search={props.search} - sortResults={props.sortResults} - toggleDataset={props.toggleDataset} - updateResultsFilter={props.updateResultsFilter} - updateQuery={props.updateQuery} - fetchResults={props.fetchResults} - clearResults={props.clearResults} - fetchSuggestions={props.fetchSuggestions} - clearSuggestions={props.clearSuggestions} - updateResultFormat={props.updateResultFormat} - analysisView={props.analysisView} - /> - ); - //resultsView = <Pie data={props.results} query={props.search.query} />; - const map = ( - <LeafletMap - sliderValue={100} - results={props.results} - geoJSON={props.geoJSON} - geoJSONKey={props.geoJSONKey} - getGeoJSON={props.getGeoJSON} - /> - ); - return ( <div className={classes.root}> <div className={classes.appFrame}> @@ -105,10 +81,35 @@ let MapApp = (props) => { </AppBar> <Grid container className={classes.mainContainer}> <Grid item xs={12} sm={analysisView ? 8 : 4}> - {resultsSection} + <VirtualizedTable + list={Immutable.List(props.results)} + resultValues={props.resultValues} + search={props.search} + sortResults={props.sortResults} + toggleDataset={props.toggleDataset} + updateResultsFilter={props.updateResultsFilter} + updateQuery={props.updateQuery} + fetchResults={props.fetchResults} + clearResults={props.clearResults} + fetchSuggestions={props.fetchSuggestions} + clearSuggestions={props.clearSuggestions} + updateResultFormat={props.updateResultFormat} + analysisView={props.analysisView} + /> </Grid> <Grid item xs={12} sm={analysisView ? 4 : 8}> - {map} + <div className={classes.map}> + <LeafletMap + sliderValue={100} + results={props.results} + geoJSON={props.geoJSON} + geoJSONKey={props.geoJSONKey} + getGeoJSON={props.getGeoJSON} + /> + </div> + <div className={classes.map}> + <Pie data={props.results} query={props.search.query} /> + </div> </Grid> </Grid> </div>