diff --git a/src/components/MapEvents.jsx b/src/components/MapEvents.jsx index 84cf6c4..11aeb78 100644 --- a/src/components/MapEvents.jsx +++ b/src/components/MapEvents.jsx @@ -27,11 +27,27 @@ class MapEvents extends React.Component { } renderCategory(events, category) { + let styleProps = ({ + fill: this.props.getCategoryColor(category), + fillOpacity: 0.8 + }) + + if (this.props.narrative) { + const { byId } = this.props.narrative + const eventsInNarrative = events.filter(e => byId.hasOwnProperty(e.id)) + if (eventsInNarrative.length <= 0) { + styleProps = { + ...styleProps, + fillOpacity: 0.1 + } + } + } + return ( 0) ? Math.sqrt(16 * events.length) + 3 : 0} + style={styleProps} onClick={() => this.props.onSelect(events)} > @@ -63,4 +79,4 @@ class MapEvents extends React.Component { } } -export default MapEvents; \ No newline at end of file +export default MapEvents; diff --git a/src/components/MapNarratives.jsx b/src/components/MapNarratives.jsx index 8835fec..2c9d777 100644 --- a/src/components/MapNarratives.jsx +++ b/src/components/MapNarratives.jsx @@ -39,10 +39,18 @@ class MapNarratives extends React.Component { return 1; } + hasNoLocation(step) { + return (step.latitude === '' || step.longitude === '') + } + renderNarrativeStep(allSteps, step, idx, n) { const { x, y } = this.projectPoint([step.latitude, step.longitude]); - const step2 = allSteps[idx + 1]; + + // don't draw if one of the steps has no location + if (this.hasNoLocation(step) || this.hasNoLocation(step2)) + return null + const p2 = this.projectPoint([step2.latitude, step2.longitude]); return (