From d62353eee3a1931c4a9902c4007f846196c8f050 Mon Sep 17 00:00:00 2001
From: Esko Ikkala <esko.ikkala@aalto.fi>
Date: Fri, 14 Sep 2018 17:38:29 +0300
Subject: [PATCH] Add creation places to result map
---
src/client/components/VirtualizedTable.js | 13 +++++++-
src/client/components/map/LeafletMap.js | 38 ++++++++++++++++-------
src/client/containers/MapApp.js | 2 +-
3 files changed, 40 insertions(+), 13 deletions(-)
diff --git a/src/client/components/VirtualizedTable.js b/src/client/components/VirtualizedTable.js
index 5dd93a40..2131fb91 100644
--- a/src/client/components/VirtualizedTable.js
+++ b/src/client/components/VirtualizedTable.js
@@ -168,6 +168,17 @@ class VirtualizedTable extends React.PureComponent {
/>
);
+ const valueFromArray = (property, rowData) => {
+ if (rowData[property] === undefined) {
+ return 'Undefined';
+ }
+ if (Array.isArray(rowData[property])) {
+ return rowData[property].map((item) => item.label).join(' / ');
+ } else {
+ return rowData[property].label;
+ }
+ };
+
return (
<div className={classes.root}>
<Grid container className={classes.container}>
@@ -219,7 +230,7 @@ class VirtualizedTable extends React.PureComponent {
/>
<Column
label="Creation place"
- cellDataGetter={({rowData}) => rowData.creationPlace}
+ cellDataGetter={({rowData}) => valueFromArray('creationPlace', rowData)}
dataKey="creationPlace"
headerRenderer={headerRenderer}
width={columnWidth}
diff --git a/src/client/components/map/LeafletMap.js b/src/client/components/map/LeafletMap.js
index 2e90bf25..fcb365d0 100644
--- a/src/client/components/map/LeafletMap.js
+++ b/src/client/components/map/LeafletMap.js
@@ -105,7 +105,7 @@ class LeafletMap extends React.Component {
// create map
this.leafletMap = L.map('map', {
center: [65.184809, 27.314050],
- zoom: 4,
+ zoom: 1,
layers: [
OSMBaseLayer,
this.resultMarkerLayer,
@@ -204,10 +204,18 @@ class LeafletMap extends React.Component {
this.resultMarkerLayer.clearLayers();
this.markers = {};
results.forEach(result => {
- const marker = this.createMarker(result);
- //console.log(result.s);
- this.markers[result.s] = marker;
- marker == null ? null : marker.addTo(this.resultMarkerLayer);
+ if (result.creationPlace !== undefined) {
+ if (Array.isArray(result.creationPlace)) {
+ result.creationPlace.forEach(place => {
+ const marker = this.createMarker(place);
+ //this.markers[result.id] = marker;
+ marker.addTo(this.resultMarkerLayer);
+ });
+ } else {
+ const marker = this.createMarker(result.creationPlace);
+ marker == null ? null : marker.addTo(this.resultMarkerLayer);
+ }
+ }
});
}
@@ -216,9 +224,18 @@ class LeafletMap extends React.Component {
this.markers = {};
const clusterer = L.markerClusterGroup();
results.forEach(result => {
- const marker = this.createMarker(result);
- this.markers[result.s] = marker;
- marker == null ? null : clusterer.addLayer(marker);
+ if (result.creationPlace !== undefined) {
+ if (Array.isArray(result.creationPlace)) {
+ result.creationPlace.forEach(place => {
+ const marker = this.createMarker(place);
+ //this.markers[result.id] = marker;
+ marker == null ? null : clusterer.addLayer(marker);
+ });
+ } else {
+ const marker = this.createMarker(result.creationPlace);
+ marker == null ? null : clusterer.addLayer(marker);
+ }
+ }
});
clusterer.addTo(this.resultMarkerLayer);
}
@@ -238,11 +255,10 @@ class LeafletMap extends React.Component {
}
createPopUpContent(result) {
+ // <p>Source: <a target='_blank' rel='noopener noreferrer' href={source}>{source}</a></p>
const popUpTemplate = `
<h3>{label}</h3>
- <p>Type: {typeLabel}</p>
- <p>Area: {broaderAreaLabel}</p>
- <p>Source: <a target='_blank' rel='noopener noreferrer' href={s}>{source}</a></p>
+
`;
return L.Util.template(popUpTemplate, result);
}
diff --git a/src/client/containers/MapApp.js b/src/client/containers/MapApp.js
index 205287fd..47d6fb9a 100644
--- a/src/client/containers/MapApp.js
+++ b/src/client/containers/MapApp.js
@@ -135,7 +135,7 @@ let MapApp = (props) => {
// console.log('oneColumnView', oneColumnView)
// console.log('resultFormat', resultFormat)
// console.log('mapMode', mapMode)
- console.log(props.results)
+ //console.log(props.results)
let table = '';
if ((oneColumnView && options.resultFormat === 'table') || (!oneColumnView)) {
--
GitLab